@media screen and (min-width: 768px) {
    .contents_body .hero{
      position: relative;
      width: 980px;
      height: 588px;
      background: url('../img/hero.jpg') no-repeat center center;
			background-size: 100% auto;
      box-sizing: border-box;
    }
    .contents_body .hero p{
      position: absolute;
      bottom: 52px;
      left: 56px;
      width: 868px;
      font-size: 15px;
      font-weight: bold;
      line-height: 28px;
      color: #fff;
      text-shadow: 0 0 5px #004F99;
      padding: 0;
    }
    .contents_body h2{
      margin: 96px 0 20px;
    }
    .contents_body p{
      font-size: 15px;
      line-height: 28px;
      padding: 28px 0 0;
    }
    .contents_body .plan1_list{
      display: flex;
      justify-content: space-between;
      margin: 46px 0 0;
    }
    .contents_body .plan1_list li{
      width: 476px;
    }
    .contents_body .plan1_list li img{
      width: 100%;
    }
    .contents_body .plan1_list li p{
      font-size: 13px;
      line-height: 17px;
      color: #666666;
      padding: 22px 0 0;
    }
    .contents_body .plan2_img{
      margin: 46px 0 0;
    }

    .contents_body .plan2_list{
      display: flex;
      justify-content: space-between;
      margin: 46px 0 28px;
    }
    .contents_body .plan2_list li:nth-child(1){
      width: 392px;
    }
    .contents_body .plan2_list li:nth-child(2){
      width: 504px;
    }
    .contents_body .plan2_list dt{
      font-size: 17px;
      font-weight: bold;
      line-height: 28px;
      text-align: center;
      padding: 0 0 20px;
    }
    .contents_body .plan2_list li:nth-child(1) dt{
      color: #1BAD55;
      border-bottom: 3px solid #1BAD55;
    }
    .contents_body .plan2_list li:nth-child(2) dt{
      color: #004F99;
      border-bottom: 3px solid #004F99;
    }
    .contents_body .plan2_list dd{
      font-size: 15px;
      line-height: 28px;
      padding: 28px 0 0;
    }

    .contents_body .btn_wrap{
      text-align: center;
      margin: 56px 0 0;
    }
    .contents_body .link{
      position: relative;
      display: inline-block;
      font-size: 15px;
      font-weight: bold;
      line-height: 20px;
      letter-spacing: 0.04em;
      color: #0099D9;
      padding: 12px 30px 12px 35px;
      border: 1px solid #CCCCCC;
      background-color: #fff;
    }
    .contents_body .link.pdf{
      padding-right: 34px;
    }
    .contents_body .link:before{
      content: '';
      position: absolute;
      left: 14px;
      top: 50%;
      transform: translateY(-50%);
      width: 14px;
      height: 14px;
      background: url(/jp/en/img/common/arrow.png) no-repeat center center;
      background-size: 100% auto;
    }
.contents_body .link.pdf:after {
    content: '';
    position: absolute;
    right: 14px;
    top: 14px;
    width: 14px;
    height: 14px;
    background: url(/jp/en/img/common/pdf.png) no-repeat center center;
    background-size: 100% auto;
}

    .contents_body .plan3_img{
      padding: 20px 0;
      text-align: center;
    }
    .contents_body .plan3_2_img{
      padding: 56px 0 0;
      text-align: center;
    }

    .contents_body .plan_pages{
      font-size: 0;
      margin: 90px -14px 0;
    }
    .contents_body .plan_pages li{
      display: inline-block;
      width: 308px;
      margin: 28px 14px 0;
    }
    .contents_body .plan_pages li a{
      position: relative;
      display: block;
      width: 100%;
      height: 84px;
      background-color: #FAFAFA;
      box-sizing: border-box;
      border: 1px solid #E6E6E6;
    }
    .contents_body .plan_pages li a span{
      position: absolute;
      left: 28px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 15px;
      line-height: 21px;
      font-weight: bold;
      color: #0099D9;
      letter-spacing: 0.04em;
      box-sizing: border-box;
      padding-right: 30px;
    }
    .contents_body .plan_pages li a:after{
      content: '';
      position: absolute;
      right: 21px;
      top: 50%;
      transform: translateY(-50%);
      width: 14px;
      height: 14px;
      background: url(/jp/en/img/common/arrow.png) no-repeat center center;
      background-size: 100% auto;
    }
    .contents_body strong{
      font-weight: bold;
    }

    .pc_none {
        display: none !important
    }
}

@media screen and (max-width: 767px) {

    html,
    body {
        /*font-size: .26667vw*/
    }

    body {
        min-width: 320px
    }

    .contents_body .hero{
      position: relative;
      width: 100%;
      padding-top: calc(202 / 375 * 100vw);
      background: url('../img/sp/hero.jpg') no-repeat center top;
			background-size: 100% auto;
      box-sizing: border-box;
    }
    .contents_body .hero p{
      font-size: 15px;
      line-height: 28px;
    }
    .contents_body h2{
      margin: 56px 0 0;
    }
    .contents_body p{
      font-size: 15px;
      line-height: 28px;
      padding: 28px 0 0;
    }

    .contents_body .plan1_list li{
      margin: 28px 0 0;
    }
    .contents_body .plan1_list li img{
      width: 100%;
    }
    .contents_body .plan1_list li p{
      font-size: 13px;
      line-height: 17px;
      color: #666666;
      padding: 22px 0 20px;
    }

    .contents_body .plan2_img{
      margin: 28px 0 0;
    }
    .contents_body .plan2_img img{
      width: 100%;
    }
    .contents_body .plan2_list{
      margin: 0 0 28px;
    }
    .contents_body .plan2_list li{
      margin: 28px 0 0;
    }
    .contents_body .plan2_list dt{
      font-size: 17px;
      font-weight: bold;
      line-height: 28px;
      text-align: center;
      padding: 30px 0 20px;
    }
    .contents_body .plan2_list li:nth-child(1) dt{
      color: #1BAD55;
      border-bottom: 3px solid #1BAD55;
    }
    .contents_body .plan2_list li:nth-child(2) dt{
      color: #004F99;
      border-bottom: 3px solid #004F99;
    }
    .contents_body .plan2_list dd{
      font-size: 15px;
      line-height: 28px;
      padding: 28px 0 0;
    }

    .contents_body .btn_wrap{
      text-align: center;
      margin: 56px 0 0;
    }
    .contents_body .link{
      position: relative;
      display: inline-block;
      font-size: 15px;
      font-weight: bold;
      line-height: 20px;
      letter-spacing: 0.04em;
      color: #0099D9;
      padding: 12px 30px 12px 35px;
      border: 1px solid #CCCCCC;
      background-color: #fff;
    }
    .contents_body .link:before{
      content: '';
      position: absolute;
      left: 14px;
      top: 50%;
      transform: translateY(-50%);
      width: 14px;
      height: 14px;
      background: url(/jp/en/img/common/arrow.png) no-repeat center center;
      background-size: 100% auto;
    }

    .contents_body .plan3_img{
      padding: 28px 0 0;
    }
    .contents_body .plan3_img img{
      width: 100%;
    }
    .contents_body .plan3_2_img{
      padding: 28px 0 0;
    }
    .contents_body .plan3_2_img img{
      width: 100%;
    }

    .contents_body .plan_pages{
      margin: 80px 0 0;
    }
    .contents_body .plan_pages li a{
      position: relative;
      display: block;
      width: 100%;
      height: 56px;
      background-color: #fff;
      box-sizing: border-box;
      border: 1px solid #E6E6E6;
      border-top: none;
    }
    .contents_body .plan_pages li:first-child a{
      border-top: 1px solid #E6E6E6;
    }
    .contents_body .plan_pages li a span{
      position: absolute;
      left: 28px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 15px;
      font-weight: bold;
      color: #0099D9;
      letter-spacing: 0.04em
    }
    .contents_body .plan_pages li a:after{
      content: '';
      position: absolute;
      right: 21px;
      top: 50%;
      transform: translateY(-50%);
      width: 14px;
      height: 14px;
      background: url(/jp/en/img/common/arrow.png) no-repeat center center;
      background-size: 100% auto;
    }

    .contents_body strong{
      font-weight: bold;
    }


    .sp_none {
        display: none !important
    }
}