@charset"UTF-8";

/*================================================
pr_box01
================================================*/
/*751----------------*/
@media screen and (min-width:751px){
  #PRODUCT .detial_box .pr_box01{
    margin-bottom: 80px;
  }

  #PRODUCT .detial_box .pr_box01 h2{
    color: #014099;
    font-size: 3.4rem;
    border-bottom: 1px solid #b8b4b4;
    padding-bottom: 20px;
    margin-bottom: 30px;
  }

  #PRODUCT .detial_box .pr_box01 .ph_box{
    margin-top: 20px;
  }

  #PRODUCT .detial_box .pr_box01 .ph_box li{
    float: left;
    width: 260px;
    margin-right: 20px;
  }

    #PRODUCT .detial_box .pr_box01 .ph_box li.li_w2{
      width: 540px;
    }

    #PRODUCT .detial_box .pr_box01 .ph_box li.li_w3{
      width: 820px;
    }

    #PRODUCT .detial_box .pr_box01 .ph_box li:last-child{
      margin: 0;
    }


  #PRODUCT .detial_box .btn{
    text-align: center;
    margin-top: 110px;
  }

  #PRODUCT .detial_box .btn a{
    background-color: #014099;
    color: #fff;
    font-size: 2.2rem;
    border: 1px solid #014099;
    padding: 15px 60px 12px 40px;
    text-decoration: none;

    background-image: url(../../common/images/arrow01.png);
    background-position: right 20px center;
    background-repeat: no-repeat;
  }

  #PRODUCT .detial_box .btn a:hover{
    background-color: #fff;
    color: #014099;
    cursor: pointer;

    background-image: url(../../common/images/arrow01_h.png);
  }
}


/*751----------------*/
@media screen and (max-width:750px){
  #PRODUCT .detial_box .pr_box01{
    margin-bottom: 10%;
    padding: 0 4%;
  }

  #PRODUCT .detial_box .pr_box01 h2{
    color: #014099;
    font-size: 2rem;
    border-bottom: 1px solid #b8b4b4;
    padding-bottom: 10px;
    margin-bottom: 10px;
  }

  #PRODUCT .detial_box .pr_box01 .ph_box{
    margin-top: 5%;
  }

  #PRODUCT .detial_box .pr_box01 .ph_box li{
    float: left;
    width: 48%;
    margin-bottom: 4%;
  }

    #PRODUCT .detial_box .pr_box01 .ph_box li.li_w1{
      width: 100%;
      margin: 0 auto 10px;
      text-align: center;
      display: block;
    }
      #PRODUCT .detial_box .pr_box01 .ph_box li.li_w1 img{
        width: 48%;
      }

    #PRODUCT .detial_box .pr_box01 .ph_box li.li_w2{
      width: 100%;
    }

    #PRODUCT .detial_box .pr_box01 .ph_box li.li_w3{
      margin: 0 !important;
      width: 100%;
    }

    #PRODUCT .detial_box .pr_box01 .ph_box li:nth-child(even){
      margin-left: 4%;
    }


  #PRODUCT .detial_box .btn{
    text-align: center;
    margin: 50px 0;
  }

  #PRODUCT .detial_box .btn a{
    background-color: #014099;
    color: #fff;
    font-size: 1.8rem;
    border: 1px solid #014099;
    padding: 15px 50px 12px 30px;
    width: 100%;
    text-decoration: none;

    background-image: url(../images/arrow01.png);
    background-position: right 20px center;
    background-repeat: no-repeat;
    background-size: 3%;
  }
}


/*clear----------------*/
#PRODUCT .detial_box .pr_box01 .ph_box{zoom:1;}
#PRODUCT .detial_box .pr_box01 .ph_box:before,#PRODUCT .detial_box .pr_box01 .ph_box:after{
  content: ".";
  display: block;
  height: 0;
  overflow: hidden;
}
#PRODUCT .detial_box .pr_box01 .ph_box:after{clear: both;}


/*================================================
pr_box01　pr_box02
================================================*/
/*751----------------*/
@media screen and (min-width:751px){
  #PRODUCT .f_nav_box{
    margin-top: 100px;
    padding-top: 100px;
    border-top: 1px solid #b8b4b4;
  }

  #PRODUCT .f_nav_box .de_in{
    width: 940px;
    margin: 0 auto 50px;
  }
  #PRODUCT .f_nav_box .de_in02{
    margin-bottom: 60px;
  }
    #PRODUCT .f_nav_box .de_in li,
    #PRODUCT .f_nav_box .de_in02 li{
      float: left;
      width: 141px;
      text-align: center;
      margin-right: 18px;
    }
      #PRODUCT .f_nav_box .de_in li:last-child,
      #PRODUCT .f_nav_box .de_in02 li:last-child{
        margin-right: 0;
      }

    #PRODUCT .f_nav_box .de_in li a,
    #PRODUCT .f_nav_box .de_in02 li a{
      background-position: center top;
      background-repeat: no-repeat;
      width: 141px;
      padding-top: 155px;
      display: block;
      text-decoration: none;
      transition: 0.3s;
    }
      #PRODUCT .f_nav_box .de_in li a:hover,
      #PRODUCT .f_nav_box .de_in02 li a:hover{
        opacity: 0.5;
      }


    #PRODUCT .f_nav_box .de_in li.ic01 a{
      background-image: url(../../common/images/ic01.png);
    }
    #PRODUCT .f_nav_box .de_in li.ic02 a{
      background-image: url(../../common/images/ic02.png);
    }
    #PRODUCT .f_nav_box .de_in li.ic03 a{
      background-image: url(../../common/images/ic03.png);
    }
    #PRODUCT .f_nav_box .de_in li.ic04 a{
      background-image: url(../../common/images/ic04.png);
    }
    #PRODUCT .f_nav_box .de_in li.ic05 a{
      background-image: url(../../common/images/ic05.png);
    }
    #PRODUCT .f_nav_box .de_in li.ic06 a{
      background-image: url(../../common/images/ic06.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic07 a{
      background-image: url(../../common/images/ic07.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic08 a{
      background-image: url(../../common/images/ic08.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic09 a{
      background-image: url(../../common/images/ic09.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic10 a{
      background-image: url(../../common/images/ic10.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic11 a{
      background-image: url(../../common/images/ic11.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic12 a{
      background-image: url(../../common/images/ic12.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic13 a{
      background-image: url(../../common/images/ic13.png);
    }
    #PRODUCT .f_nav_box .de_in02 li.ic14 a{
      background-image: url(../../common/images/ic14.png);
    }


  #PRODUCT .de_in_btn a{
    transition: 0.3s;
  }
    #PRODUCT .de_in_btn a:hover{
      opacity: 0.5;
    }
}


/*750----------------*/
@media screen and (max-width:750px){
  #PRODUCT .f_nav_box{
    margin-top: 20px;
    border-top: 1px solid #014099;
  }

  #PRODUCT .f_nav_box .de_in{
  ;
  }
  #PRODUCT .f_nav_box .de_in02{

  }
    #PRODUCT .f_nav_box .de_in li,
    #PRODUCT .f_nav_box .de_in02 li{


    }
      #PRODUCT .f_nav_box .de_in li:last-child,
      #PRODUCT .f_nav_box .de_in02 li:last-child{
        margin-right: 0;
      }

    #PRODUCT .f_nav_box .de_in li a,
    #PRODUCT .f_nav_box .de_in02 li a{
      background-color: #e2ebf9;
      color: #014099;
      display: block;
      padding: 12px 4%;
      border-bottom: 1px solid #014099;
      text-decoration: none;

      position: relative;
    }
      #PRODUCT .f_nav_box .de_in li a::after,
      #PRODUCT .f_nav_box .de_in02 li a:after{
        position: absolute;
        right: 4%;
        content: ">";
      }


  #PRODUCT .de_in_btn{
    margin: 6% 4%;
  }

  #PRODUCT .de_in_btn .left{
    margin-bottom: 6%;
  }
}




/*clear----------------*/
#PRODUCT .f_nav_box .de_in,
#PRODUCT .f_nav_box .de_in02,
#PRODUCT .f_nav_box .de_in_btn{zoom:1;}
#PRODUCT .f_nav_box .de_in:before,#PRODUCT .f_nav_box .de_in:after,
#PRODUCT .f_nav_box .de_in02:before,#PRODUCT .f_nav_box .de_in02:after,
#PRODUCT .f_nav_box .de_in_btn:before,#PRODUCT .f_nav_box .de_in_btn:after{
  content: ".";
  display: block;
  height: 0;
  overflow: hidden;
}
#PRODUCT .f_nav_box .de_in:after,
#PRODUCT .f_nav_box .de_in02:after,
#PRODUCT .f_nav_box .de_in_btn:after{clear: both;}