.form-box .col.pic-box {
    float: right;
    width: 170px;
    line-height: normal;
}

.form-box .col.pic-box.floatnone {
    float: none;
}

.form-box .col.pic-box .pic {
    width: 170px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    overflow: hidden;
}

.form-box .col.pic-box.floatnone {
    max-width: 400px;
    width: inherit;
}

.form-box .col.pic-box.floatnone .pic {
    max-width: 248px;
    width: 100%;
    float: left;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.form-box .col.pic-box.floatnone .btn-box {
    float: right;
    clear: none;
}

.form-box .col.pic-box button {
    width: 120px;
    margin: 0 auto 10px;
    padding: 5px 0;
    cursor: pointer;
    display: block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #C8C8C8;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e4e4e4+100 */
    background: #ffffff;
    /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #e4e4e4 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%, #e4e4e4 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%, #e4e4e4 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e4e4e4', GradientType=0);
    /* IE6-9 */
}

.form-box .col.pic-box .update {
    width: 122px;
    display: block;
    overflow: hidden;
    height: 42px;
    position: relative;
    margin: 0 auto;
}

.form-box .col.pic-box .update input[type="file"] {
    opacity: 0;
    cursor: pointer;
}

.form-box .col.pic-box .update:before {
    content: '上傳照片';
    width: 120px;
    margin: 0 auto 10px;
    padding: 5px 0;
    cursor: pointer;
    display: block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #C8C8C8;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e4e4e4+100 */
    background: #ffffff;
    /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #e4e4e4 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%, #e4e4e4 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%, #e4e4e4 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e4e4e4', GradientType=0);
    /* IE6-9 */
    position: absolute;
    left: 0;
    bottom: 0;
    color: #000;
}

.form-box .col.pic-box .update:hover:before {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e4e4e4+0,ffffff+100 */
    background: #e4e4e4;
    /* Old browsers */
    background: -moz-linear-gradient(top, #e4e4e4 0%, #ffffff 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #e4e4e4 0%, #ffffff 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #e4e4e4 0%, #ffffff 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#e4e4e4', endColorstr='#ffffff', GradientType=0);
    /* IE6-9 */
    pointer-events: none;
}

.form-box .col.pic-box button:hover {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e4e4e4+0,ffffff+100 */
    background: #e4e4e4;
    /* Old browsers */
    background: -moz-linear-gradient(top, #e4e4e4 0%, #ffffff 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #e4e4e4 0%, #ffffff 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #e4e4e4 0%, #ffffff 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#e4e4e4', endColorstr='#ffffff', GradientType=0);
    /* IE6-9 */
}

.form-box .col.form {
    float: left;
    width: calc(100% - 230px);
}

.check-agree-box {
    border-width: 1px 0;
    clear: both;
    font-size: 15px;
    color: #525252;
    float: right;
    width: calc(100% - 220px);
}

.check-agree-box .form-checkbox span {
    color: #EB0000;
}

.check-agree label {
    display: inline-block;
    margin: 5px 0;
}

.check-agree strong,
.check-agree a {
    color: #FFDF00;
}

.check-agree a:hover {
    text-decoration: underline;
}

@media screen and (max-width:1120px) {
    .check-agree-box {
        width: calc(100%);
        float: none;
        margin: 40px -20px 10px;
        padding: 15px 20px;
    }
}

@media screen and (max-width:767px) {
    .form-box .col.form,
    .form-box .col.pic-box {
        float: none;
    }
    .form-box .col.pic-box {
        margin: 0 auto;
    }
    .form-box .col.form {
        width: 100%;
    }
}

@media screen and (max-width:476px) {
    .form-box .col.pic-box.floatnone .pic,
    .form-box .col.pic-box.floatnone .btn-box {
        float: none;
        margin: 0 auto;
        text-align: center;
    }
}