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

body {
 font-family: "Original Yu Gothic", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", Verdana, Roboto, "Segoe UI", sans-serif;
 color: #1A2229;
 
}


#kentei{margin-top: 200px;}
  
  /* ラジオボックスをリセット */   
#kentei input[type="radio"] {
   margin: 0;
   padding: 0;
   background: none;
   border: none;
   border-radius: 0;
   outline: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   width: 0;
    } 
 
  /* ラジオボックスデザイン */
#kentei .rd_btn{
   position: relative;
   margin-bottom: 15px;
   font-size: 20px;
   text-align: center;
   }
 
#kentei .rd_btn label{
   width: 80%;
   padding: 20px 10px;
   border: 2px solid #def1d5;
   border-radius: 40px;
   background-color: #ffffff;
   cursor: pointer;
   display: inline-block;
   color: #52bf16;
   font-weight: bold;
   }

#kentei .rd_btn input[type="radio"]::before,
#kentei .rd_btn input[type="radio"]::after {
   content: "";
   display: block; 
   position: absolute;
    }

 
  /*チェック*/
#kentei .rd_btn input[type="radio"]::after {
   border-bottom: 3px solid #ffffff;/*チェックの太さ*/
   border-left: 3px solid #ffffff;/*チェックの太さ*/
   opacity: 0;/*チェック前は非表示*/
   height: 10px;/*チェックの高さ*/
   width: 20px;/*チェックの横幅*/
   transform: rotate(-45deg);
   margin-top: -2px;
   transform: translateY(-50%)rotate(-45deg);
   top: 50%;/*チェック時の位置調整*/
   left: 15%;
    }

#kentei .rd_btn input[type="radio"]:checked::after {
   opacity: 1;/*チェック後表示*/
   background-color: transparent;
    } 

#kentei .rd_btn input[type="radio"]:checked::before {
   background-color: #fd7fc3;/*チェック後枠*/
    } 

#kentei .rd_btn input[type="radio"]:checked + label{
   border: 2px solid #fd7fc3;
   background-color: #fd7fc3;
   color: #ffffff;
   font-weight: bold;
    }

#kentei #Button_area{
 text-align: center;
 margin-top: 70px;
}
#kentei #Error_area{
 text-align: center;
 max-width: 700px;
 margin: 0 auto;
}
#kentei #submitButton{
 background-color: #fd7fc3;
 color: #FFFFFF;
 border: none;
 width: 100%;
 max-width: 300px;
 border-radius: 100px;
 text-align: center;
 padding: 15px;
 font-size: 20px;
 font-weight: bold;
 cursor: pointer;
 background-image: url("../images/arrow.png");
 background-repeat:no-repeat;
 background-position: right 25px center;
}

#kentei h2#cnt_txt{
 width:calc(100% - 40px);
 margin: 0 auto;
 max-width: 700px;
 font-size: 30px;
 margin-top: 30px;
 text-align: center;
}

#kentei h2#cnt_txt span{
 font-size: 24px;
}

#kentei p#cnt_txt{
 width:calc(100% - 40px);
 margin: 0 auto;
 max-width: 700px;
 font-size: 16px;
 margin-top: 30px;
 text-align: center;
}

#kentei p#thx_txt{
 width:calc(100% - 40px);
 margin: 0 auto;
 max-width: 700px;
 font-size: 20px;
 margin-top: 200px;
 margin-bottom: 200px;
 text-align: center;
 color: #1b3395;
}

#kentei h3{
 font-size: 22px;
 font-weight: bold;
 margin-top: 50px;
 margin-bottom: 20px;
 color: #000000;
 padding: 10px 20px;
 background-color: #ffffff;
 border-left: solid 10px #52bf16;
}

#kentei h3 span{
 font-size: 14px;
 font-weight: normal;
 padding-left: 10px;
 color: #666666;
}

#kentei #form_bg {
 background-color:#f2faee;
 padding: 1px 0 50px;
 width: 100%;
}

#kentei #form_area {
 width:calc(100% - 40px);
 margin: 0 auto;
 max-width: 700px;
}


#kentei .error-text{
 color: #fd7fc3;
 display: inline-block;
}


@media screen and (max-width:767px) {
#kentei{margin-top: 128px;}
#kentei h3{
 font-size: 16px;
}
#kentei .rd_btn,.ck_btn{
 font-size: 16px;
}
#kentei #submitButton{
 font-size: 20px;
}
#kentei input{
 height: 0;/*iPhoneで隙間調整*/
}
.sp_br{
 display: block;
}
#kentei .rd_btn label{
 width: 95%;
}
#kentei .rd_btn input[type="radio"]::after {
 left: 9%;
}
#kentei #Button_area{
 margin-top: 50px;
}
}

@media screen and (max-width:320px) {
#kentei .rd_btn input[type="radio"]::after {
 border-bottom: 2px solid #ffffff;/*チェックの太さ*/
 border-left: 2px solid #ffffff;/*チェックの太さ*/
 height: 5px;/*チェックの高さ*/
 width: 10px;/*チェックの横幅*/
}
}