
p,
h1,
h3 {
    font-size: 14px;
    padding: 0;
    margin: 0;
}
.nothing {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    opacity: 0;
}
.entire {
    position: relative;
    margin: 0 auto;
    width: 1200px;
    text-align: center;
}
section .section-title {
    margin: 0 auto;
    width: 872px;
    height: 62px;
    line-height: 57px;
    background: url("../../img/salon/1/sprites.png") -12px -7px;
    font-size: 24px;
    color: #000a48;
    font-weight: bold;
}
.info, .description {
    color: #00daff;
}

/* ============================================================================= html */

html, body {
    background: url("../../img/salon/1/background.jpg") top center;
    background-repeat: repeat-y;
}

/* ============================================================================= banner-section */

.banner-section {
    position: relative;
    padding-top: 420px;
    background: url("../../img/salon/1/banner.png") center 92px no-repeat;
    height: 600px;
    text-align: center;
}
.banner-section .section-side-title {
    font-size: 26px;
    color: #00daff;
    font-weight: bold;
}
.banner-section .items {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    margin-top: 50px;
    width: 43%;
}
.banner-section .item {
    height: 60px;
}
.banner-section .before-info, .banner-section .info {
    font-size: 16px;
    color: #00daff;
    text-align: left;
    font-weight: 500;
}

/* ============================================================================= activity-section */

.activity-section .entire {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.activity-section .section-title {
    margin-top: 100px;
}
.activity-section .description.one, .activity-section .description.two {
    font-size: 20px;
    text-align: left;
}
.activity-section .description.one {
    margin-top: 98px;
}
.activity-section .infos {
    margin: 0 auto;
    text-align: center;
    margin-top: 60px;
}
.activity-section .infos .info {
    position: relative;
    margin-top: 22px;
    width: 662px;
    height: 62px;
    /*border: solid #07b5e4 1px;
    border-radius: 30px;
    -webkit-border-image: -webkit-linear-gradient(#ba55e7, #07b5e4) 30 30;
    -o-border-image: -o-linear-gradient(#ba55e7, #07b5e4) 30 30;
    border-image: linear-gradient(#ba55e7, #07b5e4) 30 30;*/
    background: url('../../img/salon/1/round-rectangle.png') center center;
    line-height: 60px;
    font-size: 22px;
}
.activity-section .infos .info:first-child {
    margin-top: 0;
}
.activity-section .description.two {
    margin: 0 auto;
    margin-top: 60px;
}

/* ============================================================================= content-section */

.content-section .section-title {
    margin-top: 80px;
}
.content-section .cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 140px;
}
.content-section .card {
    position: relative;
    padding-top: 111px;
    width: 422px;
    height: 268px;
    background: url('../../img/salon/1/square-rectangle.png') center center;
    background-repeat: no-repeat;
}
.content-section .card:nth-child(2n) {
    margin-left: 120px;
}
.content-section .card .card-header {
    position: absolute;
    top: -60px;
    left: calc(50% - 67px);
    width: 134px;
    height: 145px;
}
.content-section .card .card-header.card-image-1 {
    background: url('../../img/salon/1/sprites.png') -451px -99px;
}
.content-section .card .card-header.card-image-2 {
    background: url('../../img/salon/1/sprites.png') -7px -99px;
}
.content-section .card .card-header.card-image-3 {
    background: url('../../img/salon/1/sprites.png') -155px -99px;
}
.content-section .card .card-header.card-image-4 {
    background: url('../../img/salon/1/sprites.png') -303px -99px;
}
.content-section .card .info {
    font-size: 24px;
    line-height: 50px;
}
.content-section .card-content {
    position: absolute;
    top: 22px;
    left: calc(50% - 112px);
    opacity: .2;
}
.content-section .card-content-image-1 {
    width: 248px; height: 224px;
    background: url('../../img/salon/1/background-sprites.png') -4px -4px;
}
.content-section .card-content-image-2 {
    width: 241px; height: 230px;
    background: url('../../img/salon/1/background-sprites.png') -4px -236px;
}
.content-section .card-content-image-3 {
    width: 219px; height: 219px;
    background: url('../../img/salon/1/background-sprites.png') -260px -236px;
}
.content-section .card-content-image-4 {
    width: 224px; height: 224px;
    background: url('../../img/salon/1/background-sprites.png') -260px -4px;
}

/* ============================================================================= person-section */

.person-section .section-title {
    margin-top: 80px;
}
.person-section .cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.person-section .card {
    position: relative;
    margin-top: 100px;
    padding: 50px 45px;
    width: 1074px;
    height: 268px;
    background: url('../../img/salon/1/long-rectangle.png') top left;
    background-repeat: no-repeat;
}
.person-section .card .brief {
    color: #cc59ff;
    text-align: right;
    font-size: 16px;
}
.person-section .card.two .brief {
    text-align: left;
}
.person-section .card .description {
    margin-top: 44px;
    font-size: 16px;
    text-align: left;
    /*text-indent: 2em;*/
    line-height: 35px;
}
.person-section .card .card-content {
    position: absolute;
    top: -38px;
    left: 50px;
    width: 310px;
    height: 77px;
    background: url('../../img/salon/1/short-rectangle.png') top left;
    background-repeat: no-repeat;
}
.person-section .card.two .card-content {
    left: initial;
    right: 50px;
}
.person-section .card-content .card-content-image {
    margin: 14px auto;
    width: 157px;
    height: 48px;
}
.person-section .card-content .card-content-image-1 {
    background: url('../../img/salon/1/sprites.png') -599px -99px;
}
.person-section .card-content .card-content-image-2 {
    width: 103px;
    background: url('../../img/salon/1/sprites.png') -770px -99px;
}
.person-section .card-content .card-content-image-3 {
    background: url('../../img/salon/1/sprites.png') -599px -161px;
}

/* ============================================================================= info-section */

.info-section .section-title {
    margin-top: 80px;
}
.info-section .items {
    display: flex;
    justify-content: center;
    margin-top: 100px;
}
.info-section .item {
    height: 60px;
}
.info-section .item.one {
    width: 280px;
}
.info-section .item.two {
    width: 450px;
    margin-left: 80px;
}
.info-section .item .item-image {
    float: left;
    margin-right: 20px;
}
.info-section .item .item-image-1 {
    width: 58px;
    height: 58px;
    background: url('../../img/salon/1/time.png') top left;
    background-repeat: no-repeat;
}
.info-section .item .item-image-2 {
    width: 48px;
    height: 60px;
    background: url('../../img/salon/1/location.png') top left;
    background-repeat: no-repeat;
}
.info-section .before-info {
    font-size: 16px;
    color: #00daff;
    text-align: left;
}
.info-section .info {
    font-size: 22px;
    text-align: left;
}

/* ============================================================================= form-section */

.form-section {
    text-align: center;
}
.form-section .section-title {
    margin-top: 80px;
}
.form-section .info {
    margin-top: 10px;
    font-size: 20px;
}
.form-section .form {
    margin-top: 60px;
}
.form-section .form .input-container {
    position: relative;
    margin: 0 auto;
    width: 592px;
    height: 72px;
    border-radius: 10px;
    background: #141d56;
}
.form-section .form .form-item {
    padding-left: 45px;
    width: 592px;
    height: 72px;
    line-height: 70px;
    background: url('../../img/salon/1/input-rectangle.png') top left;
    background-repeat: no-repeat;
    color: white;
    letter-spacing: 2px;
}
.form-section .form .form-item::-webkit-input-placeholder{
    color: rgba(255, 255, 255, .7);
}
.form-section .form .form-item::-moz-placeholder{
    color: rgba(255, 255, 255, .7);
}
.form-section .form .form-item::-ms-input-placeholder{
    color: rgba(255, 255, 255, .7);
}
.form-section .form .form-item::placeholder{
    color: rgba(255, 255, 255, .7);
}
.form-section .submit-button {
    position: relative;
    margin: 0 auto;
    margin-top: 60px;
    margin-bottom: 70px;
    width: 350px;
    height: 60px;
    line-height: 60px;
    border-radius: 10px;
    cursor: pointer;
}
.form-section .submit-button.dead {
    cursor: not-allowed;
}
.form-section .submit-button .button-background {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    -webkit-background: -webkit-linear-gradient(#a011dc, #01daff);
    -o-background: -o-linear-gradient(#a011dc, #01daff);
    background: linear-gradient(#a011dc, #01daff);
    opacity: .3;
    z-index: 0;
    transition: .4s;
}
.form-section .submit-button:hover .button-background {
    opacity: 1;
}
.form-section .submit-button .button-content {
    color: white;
    font-size: 20px;
    text-align: center;
    z-index: 1;
    opacity: .99;
}
