@charset "UTF-8";

* {
    margin: 0;
    padding: 0;
    line-height: 100%;
    box-sizing: border-box;
}
body {
    min-width: 320px;
    color: #82642C;
    font-family: "ヒラギノ角ゴ Pro W6","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}
#wrapper {
    overflow: hidden;
    width: 100%;
}
a {
    text-decoration: none;
}

/* ====================================================================================================
    button
   ==================================================================================================== */

button {
    border: none;
    background: none;
    cursor: pointer;
}
button.submit img {
    width: 74vw;
}
button:focus {
    outline: 0;
}
a:hover img,
button:hover img {
    opacity: 0.75;
}

.left {
    float: left;
}
.right {
    float: right;
}
.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

/* ====================================================================================================
    header_bar
   ==================================================================================================== */

.header_bar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 10vw;
    font-size: 2.6vw;
    font-weight: bold;
    line-height: 10vw;
    text-align: center;
    background-color: #e7e3db;
}
.header_visual {
    z-index: -1;
    position: relative;
    margin-top: 10vw;
    width: 100%;
    max-height: 65vmax;
    overflow: hidden;
}
.header_visual .bg img {
    width: 100vw;
}
.header_visual h2 {
    z-index: 10;
    position: absolute;
    top: 3vw;
    left: 2vw;
}
.header_visual h2 img {
    width: 72vw;
}
.header_visual .race-l {
    z-index: 1;
    position: absolute;
    left: -10vw;
}
.header_visual .race-l img {
    width: 51vw;
}
.header_visual .race-r {
    z-index: 1;
    position: absolute;
    right: -5vw;
}
.header_visual .race-r img {
    width: 35vw;
}
.header_visual .logo {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 3vw;
}
.header_visual .logo img {
    width: 21vw;
}

/* ====================================================================================================
    contents
   ==================================================================================================== */

.contents-head {
    display: block;
    position: rekative;
    width: 150%;
    margin: -50px 0 0 -25%;
    border-top: 55vw solid #e0efeb ;
    background-color: #e0efeb;
    border-top-left-radius: 100%;
    border-top-right-radius: 100%;
}

#contents {
    display: block;
    position: relative;
    margin-top: -47vw;
    text-align: center;
}

/* :::::: intro :::::: */

#contents .intro {
    padding-bottom: 4vw;
    background: #e0efeb url(../img/intro_balloon.png) center top no-repeat;
    background-size: 98% auto;
}
#contents .intro .toform {
    margin-bottom: 0;
}
#contents .intro .toform img {
    width: 75vw;
    padding-left: 10px;
}
.contents_title {
    padding-bottom: 2vw;
}
.contents_title img {
    width: 50vw;
}

a.toform {
    display: block;
    margin-bottom: 3vw;
}
a.toform img {
    width: 96vw;
}
.tel {
    display: block;
    padding-bottom: 4vw;
}
.tel > img {
    width: 100vw;
    padding: 0 4vw;
}
.tel .num {
    display: block;
    padding: 3vw;
}
.tel .num > img {
    width: 60vw;
}

#voice {
    width: 100%;
}
#contents .race-box {
    overflow: hidden;
    width: 92vw;
    margin: 0 auto 5vw;
    box-shadow: 0 1px 5px rgba(0,0,0,.4);
    background: #fff no-repeat url(../img/lace.png);
    background-size: auto 7vw;
}

.section_title {
    margin-bottom: 4vw;
}
.section_title img {
    width: 72vw;
}

/* ====================================================================================================
    contents
   ==================================================================================================== */

#voice {
    background-color: #e0efeb;
}
#voice .balloons {
    position: relative;
    margin: 0 auto;
    width: 96%;
    height: 33vw;
    overflow: hidden;
}
#voice .balloons .bg {
    position: absolute;
}
#voice .balloons .bg img {
    width: 100%;
}
#voice .balloons .toform {
    position: absolute;
    bottom: 4vw;
    left: 0%;
}
#voice .balloons .toform img {
    width: 74%;
}

/* ====================================================================================================
    voice
   ==================================================================================================== */

#voice {
    z-index: 10000;
}
#voice .race-box {
    padding: 12vw 4vw 6vw;
}
#voice .race-box h3 img {
    width: 60vw;
}

/* :::::: client-list :::::: */

#voice .race-box .client-list {
    list-style: none;
}
#voice .race-box .client {
    margin-bottom: 5vw;
}
#voice .race-box .client > img {
    float: left;
    width: 32vw;
}
#voice .race-box .client .caption {
    float: right;
    width: 48vw;
    text-align: left;
}
#voice .race-box .client dt {
    margin-top: 2vw;
}
#voice .race-box .client dt img {
    height: 8vw;
}
#voice .race-box .client .ttl {
    margin-top: 3vw;
}
#voice .race-box .client .ttl img {
    height: 9vw;
}
#voice .race-box .client .txt {
    clear: both;
    padding-top: 4vw;
}
#voice .race-box .client p img {
    width: 100%;
}

/* ====================================================================================================
    request-form
   ==================================================================================================== */

#request-form {
    padding: 4vw;
    background-color: #fff;
}
#request-form form {
    margin: 0 auto;
    padding: 4vw 0 3vw;
    width: 92vw;
    box-shadow: 0 1px 5px rgba(0,0,0,.4);
    background-color: #E7E3DB;
}
#request-form form .process img {
    width: 86vw;
}

#request-form form table {
    margin: 3vw auto 6vw;
    width: 88vw;
}
#request-form form table tbody tr td {
    padding: 2vw 1vw;
    text-align: left;
    vertical-align: top;
}
#request-form form table tbody tr td label {
    display: inline-block;
    padding-top: 8px;
    font-size: 3.2vw;
    font-weight: bold;
    white-space: pre;
    cursor: pointer;
}
#request-form form table tbody tr td label.checkbox {
    color: #000;
    font-size: 3.2vw;
    font-weight: normal;
}
#request-form form table tbody tr td input[type=text],
#request-form form table tbody tr td textarea,
#request-form form table tbody tr td select {
    padding: 2vw 8px 1vw;
    width: 100%;
    font-size: 3.2vw;
    font-weight: normal;
    box-shadow: 0 1px 3px rgba(0,0,0,.4);
    border: none;
    border-radius: 5px;
}
#request-form form table tbody tr td #prefecture {
    width: 30%;
    height: 6.8vw;
}
#request-form form table tbody tr td #city {
    width: 68%;
}
#request-form form table tbody tr td textarea {
    line-height: 140%;
}
#request-form form table tbody tr td label[for=qualifications_1] {
    margin-right: 2vw;
}
#request-form form table tbody tr td input[type=checkbox] {
    margin-right: 1vw;
}
#request-form form table tbody tr td .required {
    margin-top: 2px;
    padding: 6px 6px 6px;
    box-shadow: 0 1px 2px rgba(0,0,0,.4);
    background: #D73F73;
    font-size: 2.8vw;
    text-align: center;
    white-space: pre;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
#request-form form table tbody tr td .required:before {
    content: "必須";
    color: #fff;
}

#request-form form table .error {
    color: red;
    background-color: #fee;
}
#request-form form table .errmsg {
    display: none;
    clear: both;
    padding: 3vw 0 1vw 1em;
    color: red;
    font-size: 2.8vw;
    background: no-repeat url(../img/error.gif) left 3vw;
}

/* ====================================================================================================
    footer
   ==================================================================================================== */

footer .bottomline {
    height: 8vw;
    font-size: 2.6vw;
    font-weight: bold;
    line-height: 8vw;
    text-align: center;
    background-color: #b5c640;
}
footer .container {
    background: #82642c no-repeat url(../img/logo.png) 2vw 0;
    background-size: 20vw auto;
    padding: 3vw 0 3vw 26vw;
}

footer nav ul {
    list-style: none;
}
footer nav li {
    float: left;
    font-size: 2.2vw;
}
footer nav li + li:before {
    content: "";
    display: block;
    float: left;
    width: 1px;
    height: 1em;
    background: #fff;
}
footer nav li a {
    padding-right: 1em;
    color: #fff;
}
footer nav li + li a {
    padding: 0 1em;
}

footer h2 {
    margin-top: 2vw;
}
footer h2 img {
    float: left;
    width: 62vw;
}

footer .copyright {
    margin-top: 2vw;
    color: #fff;
    font-size: 2.2vw;
}