﻿@charset "utf-8";





@media all and (max-width:1440px){
  .banner_area{width: 100%;}
  .banner_area .inner_con .img1{display: block;}
  .banner_area .inner_con .img2{display: none;}
  .banner_area .inner_con .img3{display: none;}

  .main_con{padding: 0 2%}
  .main_con_bg > div{padding-left: 2%; padding-right: 2%}

  .radius_box2 .txt{padding: 0}
}



@media all and (max-width:1200px){
.section_04 .box_area{margin-top: 2%}
.section_04 .box_area li{float: left; width: 32%; margin-right: 2%; /*border-radius: 50px;*/  padding-bottom: 20%; position: relative;}
.section_04 .box_area li img { width:100%;}
.section_04 .box_area li div{position: absolute; top: 0; left: 0;  padding-top: 0%;}
.section_04 .box_area li.box1{}
.section_04 .box_area li.box2{}
.section_04 .box_area li.box3{ margin: 0}

}


@media all and (max-width:980px){
.section_04{margin-top: 12%; padding-bottom: 12%;}
  .section_04 .title_area h3 span{display: block;}
  .section_04 .box_area li{width: 100%; padding-bottom: 0%;}
  .section_04 .box_area li div{padding-top: 5%; }
  .section_04 .box_area li.box1 div{position: relative; margin-left: 0%;}
  .section_04 .box_area li.box1{float: none; margin: 0 auto 1% auto; padding-bottom: 1%}
  .section_04 .box_area li.box2 div{position: relative; margin-left: 0%;}
  .section_04 .box_area li.box2{float: none; margin: 0 auto 1% auto; padding-bottom: 1%}
  .section_04 .box_area li.box3 div{position: relative; margin-left: 0%;}
  .section_04 .box_area li.box3{float: none; margin: 0 auto 1% auto; padding-bottom: 1%}

}



@media all and (max-width:768px){
  .banner_area .inner_con .img1{display: none;}
  .banner_area .inner_con .img2{display: none;}
  .banner_area .inner_con .img3{display: block;}
  .banner_area .con_area h1.logo{margin-top: 4%}
  

}


@media all and (max-width:640px){
  body{font-size: 11px}

  .banner_area .con_area h2{margin-top: 5%; font-size: 3.25em}
  .banner_area .con_area h3{padding: 0 15%; word-break: keep-all; line-height: 1.25em}

  .section_01-1, .section_01-2{margin-top: 8%}

  .radius_box1.box_01{background-image: url(../img/box_bg_img_06.png?v=1); background-position: center top; background-size: 100%}
  .radius_box1{padding-bottom: 5%}
  .radius_box1.box_01 h4{padding: 6% 0;}
  .radius_box1.box_01 .icon01{margin-top: 5%}
  .radius_box1 .con{margin-top: 5%; width: 90%}
  .radius_box1 .txt02{margin-top: 4%}

  .section_01-2 .box_type_01{width: 100%; padding-bottom: 6%}
  .section_01-2 .box_type_01.box_left{float: none;}
  .section_01-2 .box_type_01.box_right{float: none}
  .radius_box2{position: relative;}

  .section_02{margin-top: 12%; padding-bottom: 12%; background-size: auto 8%}
  .section_02 .inner_con{margin-top: 10%}
  .section_02 .inner_con .box_left{float: none}
  .section_02 .inner_con .box_right{float: none}
  .section_02 .inner_con .con-txt{width: 100%; margin-top: 5%}
  .section_02 .inner_con .con-img{width: 100%}
  .section_02 .inner_con .con-txt .line{height: 40px}

  .section_03{background-size: auto 40%}
  .radius_box1.box_02{padding: 10% 0}
  .radius_box1.box_02 .con table{font-size: 8px}
  .radius_box1.box_02 .con table thead th, .radius_box1.box_02 .con table tbody td, .radius_box1.box_02 .con table tfoot th{padding: 3% 0}

  .section_04{margin-top: 12%; padding-bottom: 12%;}
  .section_04 .title_area h3 span{display: block;}
  .section_04 .box_area li{width: 100%; padding-bottom: 0%;}
  .section_04 .box_area li div{padding-top: 5%; }
  .section_04 .box_area li.box1 div{position: relative; margin-left: 0.5%;}
  .section_04 .box_area li.box1{float: none; margin: 0 auto 1% auto; padding-bottom: 1%}
  .section_04 .box_area li.box2 div{position: relative; margin-left: 0.5%;}
  .section_04 .box_area li.box2{float: none; margin: 0 auto 1% auto; padding-bottom: 1%}
  .section_04 .box_area li.box3 div{position: relative; margin-left: 0.5%;}
  .section_04 .box_area li.box3{float: none; margin: 0 auto 1% auto; padding-bottom: 1%}



  .section_05{background-size: cover; background-position: center bottom; padding-bottom: 12%}
  .radius_box1.box_03{background-image: url(../img/box_bg_img_07.png?v=3); background-position: center top; background-size: 100%}
  .radius_box1.box_03 h4 span{display: block;}
  .section_05 .inner_con_02{margin-top: 12%}
  .section_05 .inner_con_02 .info_area{margin-top: 6%}
  .section_05 .inner_con_02 .info_area p{margin-top: 5%}
  .section_05 .inner_con_02 .info_area p span{display: block;}

  .footer p{font-size: 1em; padding: 0 3%; line-height: 1.75em}

}

@media all and (max-width:320px){
  body{font-size: 8px !important}

  .section_04 .box_area li{float: none; width: 100%; padding-bottom: 45% !important; margin-bottom: 3%}
  .section_04 .box_area li div{padding-top: 5%; position: relative;}
}

@media all and (min-width:641px) and (max-width:768px){
  body{font-size: 12px}

  .section_01-2 .box_type_01{padding-bottom: 42%}

  .section_04 .box_area li{padding-bottom: 42%}

  .section_05{background-size: 160%}
}

@media all and (min-width:769px) and (max-width:1024px){
  body{font-size: 12px}

  .section_01-2 .box_type_01{padding-bottom: 40%}

  .section_04 .box_area li{padding-bottom: 20%}

  .section_05{background-size: 140%}


}

@media all and (min-width:1025px) and (max-width:1366px){
  body{font-size: 14px}




}




@media all and (min-width:1441px){
  .banner_area{width: 100%; background-image: url(../img/main_bn_bg.png); background-repeat: no-repeat; background-position: center top;}
  .banner_area .inner_con .img1{display: none;}
  .banner_area .inner_con .img2{display: block;}
  .banner_area .inner_con .img3{display: none;}


}
