/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 25 2020 | 11:43:07 */
.radio,input[type="checkbox"] {
        display: none; /* まず、＜input＞タグの表示を消します*/
    }
    label {
        position: relative;/* ＜label＞を位置の指標になる指示を書きます*/
        display: inline-block;
        padding: 3px 3px 3px 20px;
        cursor: pointer;
    }
    .radio+span::before,/* ＜span＞タグの疑似要素を作ります*/
	span::after {
        position: absolute;
        content: '';
        top: 50%;
        border-radius: 100%;
        -webkit-transition: all .2s;
        transition: all .2s;
    }
    .radio+span::before {
        left: 0;
        width: 14px;
        height: 14px;
        margin-top: -8px;
        background: #f3f3f3;/* ラジオボタンの元の色の指定*/
        border: 1px solid #ccc;
    }
    .radio+span:hover::before {
        background: #fff;/* ラジオボタンのマウスオーバーしたときの色の指定*/
    }
    .radio+span::after {
        opacity: 0;
        left: 4px;
        width: 8px;
        height: 8px;
        margin-top: -4px;
        background: #3498db;/* ラジオボタンのチェックした時の色の指定*/
        -webkit-transform: scale(2);
        transform: scale(2);
    }
    .radio:checked + span::before {/* ラジオボタンがチェックされたときの隣接しているタグへの指示を書きます*/
        background: #fff;
        border: 1px solid #3498db;/* ラジオボタンのチェックした時の枠の線の指定*/
    }
    .radio:checked + span::after {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }


.checkbox {
  border: 1px solid #999;
  padding: 10px 3px 10px 3px;
  margin-bottom: 8px;
}

.mwform-checkbox-field-text{
  padding-left: 5px;
  position:relative;
  margin-right: 0px;
}
.mwform-checkbox-field-text::before{
  content: "";
  display: block;
  position: absolute;
  top: 2px;
  left: -16px;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  border-radius: 4px;
}
input[type="checkbox"]:checked + .mwform-checkbox-field-text{
  color: #3498db;
}
input[type="checkbox"]:checked + .mwform-checkbox-field-text::after{
  content: "";
  display: block;
  position: absolute;
  top: -2px;
  left: -11px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #3498db;
  border-right: 3px solid #3498db;
}



/*･･･2択用ラジオボタン*/

.kahiko {
  display: flex;
  justify-content: space-between;
}
.komoku {margin-top:6px;}

.nitaku {display: inline-block;}

.nitaku input {
	display: none;
}
.nitaku label{
	display: inline-block;
	float: left;
	width: 60px;
	margin: 0;
	padding: 5px;
	background: #bdc3c7;
	color: #869198;
	font-size: 16px;
	text-align: center;
	line-height: 1;
	transition: .2s;
}
.nitaku label:first-of-type{
	border-radius: 3px 0 0 3px;
}
.nitaku label:last-of-type{
	border-radius: 0 3px 3px 0;
}
.nitaku input[type="radio"]:checked+.kokaika {
	background-color: #3498db;
	color: #fff;
	font-weight: 600;
}
.nitaku input[type="radio"]:checked+.kokaihi {
	background-color: #e67168;
	color: #fff;
	font-weight: 600;
}