.custom_p_blue {
    position: relative;
    padding-left: 25px;
    font-size:1rem;
    font-weight:bold;
    display: inline-block;
    color: #31A9EE;
}
  
.custom_p_blue:before {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 85;
    width: 0;
    height: 0;
    border: none;
    /*border-left: solid 15px transparent;*/
    border-right:5px solid #31A9EE;
    border-bottom: solid 10px #31A9EE;
    transform:skew(45deg);
}
.custom_p_blue:after {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 10px;
    width: 110%;
    border-bottom: solid 3px #31A9EE;
}

.custom_p_blue2 {
    position: relative;
    padding-left: 25px;
    font-size:1rem;
    font-weight:bold;
    display: inline-block;
    color: #31A9EE;
}
  
.custom_p_blue2:before {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 0;
    width: 0;
    height: 0;
    border: none;
    border-left: solid 15px transparent;
    border-bottom: solid 15px #31A9EE;
}
.custom_p_blue2:after {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 10px;
    width: 100%;
    border-bottom: solid 3px #31A9EE;
}

.custom_p_green {
    position: relative;
    padding-left: 25px;
    font-size:1rem;
    font-weight:bold;
    display: inline-block;
    color: #00CC66;
}
  
.custom_p_green:before {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 100;
    width: 0;
    height: 0;
    border: none;
    /*border-left: solid 15px transparent;*/
    border-right:5px solid #00CC66;
    border-bottom: solid 10px #00CC66;
    transform:skew(45deg);
}
.custom_p_green:after {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 10px;
    width: 110%;
    border-bottom: solid 3px #00CC66;
}

.custom_p_red {
    position: relative;
    padding-left: 25px;
    font-size:1rem;
    font-weight:bold;
    display: inline-block;
    color: #FF4F50;
}
  
.custom_p_red:before {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 85;
    width: 0;
    height: 0;
    border: none;
    /*border-left: solid 15px transparent;*/
    border-right:5px solid #FF4F50;
    border-bottom: solid 10px #FF4F50;
    transform:skew(45deg);
}
.custom_p_red:after {
    position: absolute;
    content: '';
    bottom: -3px;
    left: 10px;
    width: 110%;
    border-bottom: solid 3px #FF4F50;
}

/*セクションタイトル*/
.custom_h3 {
    color: #6594e0;/*文字色*/
    /*線の種類（点線）2px 線色*/
    border-bottom: dashed 2px #6594e0;
    font-size:1.5rem;
    font-weight:bold;
    max-width:70rem;
}

/*ラジオボタン*/
.custom_radio {
    display: none; /* ラジオボタンを非表示にする */
}

/*青ラジオ*/
.custom_radio_blue:checked + .custom_label_blue {
    background: #31A9EE;/* マウス選択時の背景色を指定する */
    color: #ffffff; /* マウス選択時のフォント色を指定する */
}

.custom_label_blue:hover {
    background-color: #E2EDF9; /* マウスオーバー時の背景色を指定する */
}

.custom_label_blue {
    padding: 10px 30px;
    border: 2px solid #31A9EE;/* ボックスの境界線を実線で指定する */
    border-radius: 5px; /* 角丸を指定する */
    color:#31A9EE;
}


/*緑ラジオ*/
.custom_radio_green:checked + .custom_label_green {
    background: #009900;/* マウス選択時の背景色を指定する */
    color: #ffffff; /* マウス選択時のフォント色を指定する */
}

.custom_label_green:hover {
    background-color: #E2EDF9; /* マウスオーバー時の背景色を指定する */
}

.custom_label_green {
    padding: 10px 30px;
    border: 2px solid #009900;/* ボックスの境界線を実線で指定する */
    border-radius: 5px; /* 角丸を指定する */
    color:#009900
}

/*赤ラジオ*/
.custom_radio_red:checked + .custom_label_red {
    background: #BB0000;/* マウス選択時の背景色を指定する */
    color: #ffffff; /* マウス選択時のフォント色を指定する */
}

.custom_label_red:hover {
    background-color: #E2EDF9; /* マウスオーバー時の背景色を指定する */
}

.custom_label_red {
    padding: 10px 30px;
    border: 2px solid #BB0000;/* ボックスの境界線を実線で指定する */
    border-radius: 5px; /* 角丸を指定する */
    color:#BB0000;
}


/*チェックボックス*/
.custom_checkbox {
    display:none;
}

/*チェックボックス青*/
.custom_checkbox_blue:checked + .custom_label_blue {
    background: #31A9EE;/* マウス選択時の背景色を指定する */
    color: #ffffff; /* マウス選択時のフォント色を指定する */
}

/*チェックボックス緑*/
.custom_checkbox_green:checked + .custom_label_green {
    background: #009900;/* マウス選択時の背景色を指定する */
    color: #ffffff; /* マウス選択時のフォント色を指定する */
}

/*チェックボックス赤*/
.custom_checkbox_red:checked + .custom_label_red {
    background: #BB0000;/* マウス選択時の背景色を指定する */
    color: #ffffff; /* マウス選択時のフォント色を指定する */
}

/*経由地バツボタン*/
.batsu{
    font-size: 100%;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.3em;
    line-height: 1.3em;
    cursor: pointer;
    transition: .2s;
}
    
.batsu:hover{
    color: #999;
}

.edit{
    font-size: 100%;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.3em;
    line-height: 1.3em;
    cursor: pointer;
    transition: .2s;
    color: rgb(7, 196, 0);
}
    
.edit:hover{
    color: rgb(152, 255, 148);
}

/*メール一覧　アドレスマウスホバー時文字色変更*/
.hov_msg_blue:hover{
    color:#31A9EE;
}

.point_box {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.point_box .point_title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
}
.point_box p {
    margin: 0; 
    padding: 0;
}

.dd-pre{
    /*white-space: pre;*/
    white-space: pre-wrap;
}

.ios_text{
    font-size:16px;
    
}

.ios_div{
    transform: scale(0.9);
}

.form-control[readonly]{
    background-color: #fff;
}

input[type="checkbox"] { 
    display: none; 
}

input[type="checkbox"] + label {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    font: 14px/20px 'Open Sans', Arial, sans-serif;
    color: #ddd;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

input[type="checkbox"] + label:last-child { 
    margin-bottom: 0; 
}

input[type="checkbox"] + label:before {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    border: 1px solid #31A9EE;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .6;
    -webkit-transition: all .12s, border-color .08s;
    transition: all .12s, border-color .08s;
}

input[type="checkbox"]:checked + label:before {
    width: 10px;
    top: -5px;
    left: 5px;
    border-radius: 0;
    opacity: 1;
    border-top-color: transparent;
    border-left-color: transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hclist-parent:hover{
    background-color : #f5f5f5;
}
/*.hclist{
    word-wrap : break-word;
    overflow-wrap : break-word;
}

.hclist dl{
    word-wrap : break-word;
    overflow-wrap : break-word;
}

.tlist{
    word-wrap : break-word;
    overflow-wrap : break-word;
}

.tlist dl{
    word-wrap : break-word;
    overflow-wrap : break-word;
}*/

#page_top{
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 50;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 25px;
  color: #3f98ef;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after{
  content: 'PAGE TOP';
  font-size: 13px;
  color: #fff;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: #3f98ef;
}

.border-custom-width{
    border-width: 3px;
}

.blue-arrow{
    color:#31A9EE;
}