/* ポイントボックス */
.box_point {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.box_point:before
{
    content: "ポイント";
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

/* ヒントボックス */
.box_hint {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.box_hint:before
{
    content: "匕ント";
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

/* 関連ボックス */
.box_relative {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #f0e68c;
}
.box_relative:before
{
    content: "関連情報";
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #f0e68c;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

/* 注意ボックス */
.box_alert {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #ff7d6e;
}
.box_alert:before {
    content: "注意";
	   position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #ff7d6e;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}