@charset "UTF-8";

/* SmartPhone Design ***********************/

/* common */

header {
    margin-bottom: 0;
}

main {
    margin: 0 auto;
    background: #FFFFFF;
    overflow: hidden;
}

input[type="text"],input[type="email"],input[type="url"],input[type="tel"],textarea {
    width: 100%;
    padding: 4px;
    box-sizing: border-box;
}

select {
    padding: 4px;
}

input[type="submit"] {
    background: #EEEEEE;
    border-radius: 5px;
    cursor: pointer;
    color: #333333;
    padding: 10px 40px;
    font-size: 1.2em;
    border-style: solid;
    border: 1px solid #CCCCCC;
}

/* main-nav */

.main-nav-group {
    font-size: 1.2em;
    /* display: table; */
    overflow: hidden;
    padding: 20px 10px;
}

.main-nav-link {
    /* display: table-cell; */
    /* padding: 20px 0 20px 20px; */
    float: left;
}

.main-nav-target {
    padding: 0 10px;
    float: left;
}

.main-section-contact {
    margin-bottom: 40px;
}

.main-section h2 {
    font-size: 1.6em;
    text-align: center;
    font-weight: bold;
    color: #666666;
    margin-bottom: 10px;

}

/* main-contact */

.contact-content-group {
    width: 90%;
    margin: 0 auto;
    font-size: 1.2em;
}

.contact-input-left {
    display: block;
    width: auto;
    background: #E4F4F4;
    padding: 20px;
}

.contact-input-right {
    display: block;
    padding: 20px;
    width: auto;
}

.right-group-top {
    margin-bottom: 10px;
}

.input-right-group {
    display: table;
    width: 100%;
    margin-bottom: 10px;
}

.input-postcode-group {
    width: 200px;
}

.right-group-left {
    display: table-cell;
}

.right-group-right {
    display: table-cell;
}

input[name="your-postcode"] {
    width: 120px;
}

.none-margin {
    margin-bottom: 0;
}

/* Tablet Design ***********************/

@media all and (min-width: 480px) {

    .contact-input-group {
        display: table;
        width: 100%;
    }

    .contact-input-left {
        display: table-cell;
        vertical-align: top;
        width: 30%;

    }

    .contact-input-right {
        display: table-cell;
        vertical-align: top;
        width: 70%;

    }
}

/* PC Design ***********************/

@media all and (min-width: 1024px) {

    /* common */

    main {
        width: 100%;
    }

}

@media all and (min-width: 1140px) {

    /* common */

    main {
        width: 70%;
    }

    .contact-content-group {
        width: 70%;
    }
}