@charset "utf-8";
/* CSS Document */

.system_main,.system_main2,.system_main3,.system_main4{width:100%; padding:10.5% 0 0 0;}
.system_main h2{text-indent:100%; white-space:nowrap; line-height:100%; overflow:hidden; margin:0; padding-top:39.14%; height:0; background-image:url("../../img/pc/system_main2.jpg"); background-repeat:no-repeat; background-size:contain;}

.system_main2 h2{text-indent:100%; white-space:nowrap; line-height:100%; overflow:hidden; margin:0; padding-top:39.14%; height:0; background-image:url("../../img/pc/system1_main.jpg"); background-repeat:no-repeat; background-size:contain;}

.system_main3 h2{text-indent:100%; white-space:nowrap; line-height:100%; overflow:hidden; margin:0; padding-top:39.14%; height:0; background-image:url("../../img/pc/system2_main.jpg"); background-repeat:no-repeat; background-size:contain;}

.system_main4 h2{text-indent:100%; white-space:nowrap; line-height:100%; overflow:hidden; margin:0; padding-top:39.14%; height:0; background-image:url("../../img/pc/system3_main.jpg"); background-repeat:no-repeat; background-size:contain;}

.system_main5 h2{text-indent:100%; white-space:nowrap; line-height:100%; overflow:hidden; margin:0; padding-top:39.14%; height:0; background-image:url("../../img/pc/system4_main.jpg"); background-repeat:no-repeat; background-size:contain;}

#system_sub,#system1_sub{width:100%; border-top:1px solid #ddd; margin:0 auto;}

#system_sub h3{font-size:130%; color:#4b5861; text-align:center; margin:3% auto; padding:0;}
#system_sub p{text-align:center; font-size:90%; line-height:200%; margin:3% auto; color:#333; width:94%;}

#system_con{width:100%; margin:0; padding:0;}

#system_con p{text-align:center; font-size:90%; line-height:200%; margin:4% auto; width:94%;}
#system_con ul{list-style:none; width:100%; margin:0 auto 10% auto; padding:0;}
#system_con li.service_li1{float:left; width:49%; margin:4% 2% 3% 0; padding:0;}
#system_con li.service_li2{float:left; width:49%; margin:4% 0 3% 0; padding:0;}

#system_con li a{text-decoration:none; color:#000;}
#system_con li a:hover{text-decoration:none; color:#000;}
#system_con li h4{padding:3.5% 0; margin:0 0 0 0; font-size:100%; text-align:center; border-top:3px solid #30709b;}
#system_con li h4 span{color:#000; width:100%;}
#system_con li h4 span:hover{color:#4b5861; text-decoration:none;}
#system_con li p{text-align:left; font-size:90%; line-height:190%; margin:0; padding:2.5% 2.5% 0 2.5%; color:#000;}

#system1_sub h3,#system1_con h5{font-size:130%; color:#4b5861; text-align:center; margin:3% auto; padding:0;}
#system1_sub p{text-align:left; font-size:90%; line-height:200%; margin:3% auto; color:#333; width:94%;}


.system_btn1{width:275px; margin:5% auto 5% auto; padding:0;}
.system_btn2{width:275px; margin:2.5% auto 10% auto; padding:0;}
.system_btn3{width:275px; margin:5% auto 2.5% auto; padding:0;}
.system_btn_box{width:73%; margin:5% auto 2.5% auto; padding:0;}
.system_btn_box ul{width:100%; margin:0; padding:0; list-style:none;}
.system_btn_box li{width:275px; margin:0; padding:0; float:left;}
.system_btn_box li:first-child{margin:0 1% 0 0;}

#system1_con{width:100%; border-top:1px solid #ddd; margin:6% auto 0 auto;}
#system1_con h4{font-size:120%; color:#333; text-align:center; border-top:4px solid #30709b; width:60%; margin:0 auto 4% auto; padding:10px 0;}
#system1_con p{text-align:left; font-size:90%; line-height:200%; margin:3% auto; color:#333; width:94%;}
#system1_con p.system1_text1{text-align:center; font-size:90%; line-height:200%; margin:20px auto;}
#system1_con p.system1_text1 a{color:#30709b; text-decoration:none; font-weight:bold;}
#system1_con p.system1_text1 a:hover{color:#30709b; text-decoration:underline;}
#system1_con ul{list-style:none; width:100%; margin:0; padding:0;}
#system1_con li.system1_pict_l{width:70%; margin:0 auto 4% auto; padding:0;}
#system1_con li.system1_pict_r{width:70%; margin:0 auto 4% auto; padding:0;}
#system1_con .system1_box{width:87%; border:3px solid #afc0cc; margin:4% auto;}
#system1_con .system1_box p{text-align:left; font-size:90%; line-height:300%; padding:1% 5%; color:#333; margin:1% 0;}
#system1_con li{float:none; width:100%; margin:0 0 1.5% 0; padding:0;}
#system1_con li .system1_feature{border-radius:15px; background-color:#f7f8f8; padding:2.7% 4% 1.2% 4%; width:85%; margin:0 auto;}
#system1_con li .system1_feature .system1_feature_l{float:left; width:9%; margin:0 2.5% 0 0; padding:0;}
#system1_con li .system1_feature .system1_feature_r{float:left; width:88.5%; margin:0; padding:0;}
#system1_con li .system1_feature .system1_feature_r h6{color:#c13a1f; font-size:110%; margin:0 0 0 0; line-height:140%; padding:0 10px 0 10px;}
#system1_con li .system1_feature .system1_feature_r p{border-top:1px solid #000; text-align:left; font-size:90%; line-height:180%; padding:10px 10px 0 10px; color:#333; margin:5px 0 5px 0;}
#system1_con .system1_pict{width:683px; margin:0 auto; padding:0;}

#system1_con .system2_pict1{width:80%; margin:4% auto 2% auto; padding:0;}
#system1_con .system2_pict2{width:80%; margin:1.5% auto; padding:0;}
#system1_con .system2_pict3{width:70%; margin:2% auto 9% auto; padding:0;}
#system1_con .system2_pict6{width:90%; margin:-0 auto 4% auto; padding:0;}
#system1_con .system2_subtitle1{color:#000; font-size:110%; margin:0; line-height:140%; padding:0 10px; text-align:center; font-weight:bold;}
#system1_con h5.system1_con_h5_2{font-size:130%; color:#df7915; text-align:center; margin:-2% auto 0 auto; padding:0;}
#system1_con li.system2_li1{width:65%; margin:3% auto 0 auto; padding:0;}
#system1_con li.system2_li1 img{width:100%;}
#system1_con li.system2_li2{width:100%; margin:0 0 0 0; padding:0;}
#system1_con li.system2_li2 p{text-align:left; font-size:90%; line-height:200%; margin:3% auto; color:#333; width:94%;}
#system1_con li.system2_li2 p.system2_text1{text-align:left; font-size:90%; line-height:200%; margin:0 auto 3% auto; color:#333; width:94%;}
#system1_con li.system2_li2 p.system2_text2{text-align:left; font-size:80%; line-height:200%; margin:0 auto 3% auto; color:#c32727; padding:0; width:94%;}

#system1_con li .system3_feature{border-radius:15px; background-color:#f7f8f8; padding:2.7% 4% 1.2% 4%; width:85%; margin:0 auto;}
#system1_con li .system3_feature .system3_feature_l{float:left; width:9%; margin:0 2.5% 0 0; padding:0;}
#system1_con li .system3_feature .system3_feature_r{float:left; width:88.5%; margin:0; padding:0;}
#system1_con li .system3_feature .system3_feature_r h6{color:#0180c9; font-size:110%; margin:0 0 0 0; line-height:140%; padding:0 10px 0 10px;}
#system1_con li .system3_feature .system3_feature_r p{border-top:1px solid #000; text-align:left; font-size:90%; line-height:180%; padding:10px 10px 0 10px; color:#333; margin:5px 0 5px 0;}

#system1_con .system3_pict1,#system1_con .system3_pict2{position:relative; overflow:hidden; max-width:500px; height:313px; margin:40px auto 20px auto; text-indent:100%; white-space:nowrap; padding:0; border:1px solid #bababa;}
#system1_con .system3_pict1:after{position:absolute; content:""; display:block; width:100%; height:100%; top:0; background:url(../../img/pc/system3_pict1_2.jpg) no-repeat center center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; background-size:cover; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; -ms-transition:all .3s ease-out; transition:all .3s ease-out;}
#system1_con .system3_pict2:after{position:absolute; content:""; display:block; width:100%; height:100%; top:0; background:url(../../img/pc/system3_pict2_2.jpg) no-repeat center center; -webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; background-size:cover; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; -ms-transition:all .3s ease-out; transition:all .3s ease-out;}
#system1_con .system3_pict1:hover:after,#system1_con .system3_pict2:hover:after{opacity:.8; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform:scale(1.1);}


#system1_con .system3_box{padding:0; margin:0 auto; width:705px;}
#system1_con .system3_box .system3_l{float:left; width:217px; margin:0 32px 0 0; padding:0;}
#system1_con .system3_box .system3_l img:hover{opacity:.7;}
#system1_con .system3_box .system3_r{float:left; width:456px; margin:0; padding:0;}
#system1_con .system3_box .system3_r p{text-align:left; font-size:80%; color:#c32727; line-height:200%; margin:10px 0 0 0; padding:0;}

.system1_ico1,.system1_ico1_2{margin-top:15px;}