@charset "utf-8";
/* CSS Document */


/* アイキャッチ
=======================================*/

/* カテゴリ別タイトル */

#eyecatch h2#inquiry{
    background            : url(img/pagettl_inquiry.gif) left top no-repeat;
    width                 : 365px;
    height                : 84px;
}

/* 一覧
=======================================*/

#inquiry-form {
    width                 : 750px;
    margin                : 0 auto 40px auto;
}

/* */
div#operationSteps {
    width                 : 100%;
    margin                : 0 0 40px 0;
}

div#operationSteps ul {
    display               : table;
    width                 : 100%;
    margin                : 0 auto;
}

div#operationSteps ul li {
    display               : table-cell;
    width                 : 250px;
    padding               : 0 5px;
}

div#operationSteps table {
    margin                : 0 auto;
    border-collapse       : collapse;
}

div#operationSteps table div#operationStep1 table.normalView {
}

div#operationSteps table div#operationStep1 table.spView {
    display               : none;
}

div#operationSteps table th, td {
    padding               : 0;
}

div#operationSteps table td {
    margin                : 0 auto;
    padding-right         : 15px;
}

div#operationSteps div table {
    width                 : 100%;
    height                : 34px;
    border-collapse       : collapse;
}

div#operationSteps div table th, td {
    padding               : 0;
}

div.operationStepBlack {
    width                 : 235px;
    height                : 34px;
    background            : #000;
    position              : relative;
    color                 : #fff;
}

div.operationStepBlack:before {
   width                  : 0;
   height                 : 0;
   content                : "";
   position               : absolute;
   left                   : 100%;
   top                    : 0px;
   border-top             : 17px solid transparent;
   border-left            : 10px solid #000;
   border-bottom          : 17px solid transparent;
}

div.operationStepWhite {
    width                 : 235px;
    height                : 34px;
    background            : #fff;
    position              : relative;
    border-top            : 1px solid #ccc;
    border-bottom         : 1px solid #ccc;
    border-left           : 1px solid #ccc;
    color                 : #000;
}

div.operationStepWhite:before {
   width                  : 0;
   height                 : 0;
   content                : "";
   position               : absolute;
   left                   : 100%;
   top                    : 0px;
   border-top             : 17px solid transparent;
   border-left            : 10px solid #ccc;
   border-bottom          : 17px solid transparent;
}

div.operationStepWhite:after {
   width                  : 0;
   height                 : 0;
   content                : "";
   position               : absolute;
   left                   : 100%;
   top                    : 0px;
   border-top             : 16px solid transparent;
   border-left            : 8px solid #fff;
   border-bottom          : 16px solid transparent;
}

div.operationCompleteWhite {
    width                 : 235px;
    height                : 34px;
    background            : #fff;
    border                : 1px solid #ccc;
    color                 : #000;
}

div.operationCompleteBlack {
    width                 : 235px;
    height                : 34px;
    background            : #000;
    border                : 1px solid #ccc;
    color                 : #fff;
}

div#operationSteps table td.stepLabel {
    width                 : 80px;
    color                 : red;
    font-weight           : bold;
    font-size             : 14px;
    text-align            : left;
    padding               : 0 5px;
}

div#operationSteps table td.operatonLabel {
    font-weight           : bold;
    font-size             : 14px;
    text-align            : left;
    padding               : 0 5px;
}

div#operationSteps table td.completeLabel {
    font-weight           : bold;
    font-size             : 14px;
    text-align            : center;
    padding               : 0 5px;
}

/* ボタン */
button {
    border-radius         : 3px;
    padding               : 5px 20px;
    font-size             : 18px;
    font-weight           : bold;
    text-align            : center;
    text-shadow           : -1px -1px 0 rgba(0,0,0,0.3);
    cursor                : pointer;
    -webkit-border-radius : 3px;
    -moz-border-radius    : 3px;
}

button#agreementButton {
    width                 : 440px;
    height                : 53px;
    color                 : #ffffff;
    border                : 1px solid #df0909;
    background-color      : #f62b2b;
    background-image      : -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f62b2b), color-stop(100%, #a70711));
    background-image      : -webkit-linear-gradient(top, #f62b2b, #a70711);
    background-image      : -moz-linear-gradient(top, #f62b2b, #a70711);
    background-image      : -ms-linear-gradient(top, #f62b2b, #a70711);
    background-image      : -o-linear-gradient(top, #f62b2b, #a70711);
    background-image      : linear-gradient(top, #f62b2b, #a70711);
    filter                : progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f62b2b, endColorstr=#a70711);
}

button#agreementButton:hover {
    border                : 1px solid #b30808;
    background-color      : #e40a0a;
    background-image      : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e40a0a), color-stop(100%, #76050c));
    background-image      : -webkit-linear-gradient(top, #e40a0a, #76050c);
    background-image      : -moz-linear-gradient(top, #e40a0a, #76050c);
    background-image      : -ms-linear-gradient(top, #e40a0a, #76050c);
    background-image      : -o-linear-gradient(top, #e40a0a, #76050c);
    background-image      : linear-gradient(top, #e40a0a, #76050c);
    filter                : progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e40a0a, endColorstr=#76050c);
}

button#sendButton {
    color                 : #ffffff;
    border                : 1px solid #8a66f4;
    background-color      : #b29af8;
    background-image      : -webkit-gradient(linear, left top, left bottom, color-stop(0%, #b29af8), color-stop(100%, #9174ed));
    background-image      : -webkit-linear-gradient(top, #b29af8, #9174ed);
    background-image      : -moz-linear-gradient(top, #b29af8, #9174ed);
    background-image      : -ms-linear-gradient(top, #b29af8, #9174ed);
    background-image      : -o-linear-gradient(top, #b29af8, #9174ed);
    background-image      : linear-gradient(top, #b29af8, #9174ed);
    filter                : progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#b29af8, endColorstr=#9174ed);
}

button#sendButton:hover {
    border                : 1px solid #693bf1;
    background-color      : #8e6af5;
    background-image      : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8e6af5), color-stop(100%, #6d47e7));
    background-image      : -webkit-linear-gradient(top, #8e6af5, #6d47e7);
    background-image      : -moz-linear-gradient(top, #8e6af5, #6d47e7);
    background-image      : -ms-linear-gradient(top, #8e6af5, #6d47e7);
    background-image      : -o-linear-gradient(top, #8e6af5, #6d47e7);
    background-image      : linear-gradient(top, #8e6af5, #6d47e7);
    filter                : progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#8e6af5, endColorstr=#6d47e7);
}

button#backButton {
    color                 : #000000;
    border                : 1px solid #bee1fa;
    background-color      : #f2f9fe;
    background-image      : -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f9fe), color-stop(100%, #d6f0fd));
    background-image      : -webkit-linear-gradient(top, #f2f9fe, #d6f0fd);
    background-image      : -moz-linear-gradient(top, #f2f9fe, #d6f0fd);
    background-image      : -ms-linear-gradient(top, #f2f9fe, #d6f0fd);
    background-image      : -o-linear-gradient(top, #f2f9fe, #d6f0fd);
    background-image      : linear-gradient(top, #f2f9fe, #d6f0fd);
    filter                : progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f2f9fe, endColorstr=#d6f0fd);
}

button#backButton:hover {
    border                : 1px solid #93cdf7;
    background-color      : #c3e3fa;
    background-image      : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c3e3fa), color-stop(100%, #a5defb));
    background-image      : -webkit-linear-gradient(top, #c3e3fa, #a5defb);
    background-image      : -moz-linear-gradient(top, #c3e3fa, #a5defb);
    background-image      : -ms-linear-gradient(top, #c3e3fa, #a5defb);
    background-image      : -o-linear-gradient(top, #c3e3fa, #a5defb);
    background-image      : linear-gradient(top, #c3e3fa, #a5defb);
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#c3e3fa, endColorstr=#a5defb);
}

div#commandContainer {
    width                 : 100%;
    text-align            : center;
}

/* 個人情報の取り扱い */
div#privacyInformation {
    width                 : 670px;
    margin                : 0 auto;
}

div#privacyInformationText {
    overflow              : auto;
    width                 : 100%;
    height                : 123px;
    border                : 1px solid #ccc;
    padding               : 0 5px;
}

div#privacyInformationText .rightAlign {
    text-align             : right;
}

/* 入力エリア */
ul.inquiryTable {
    width                 : 100%;
    margin                : 10px 0px;
}

ul.inquiryTableRow {
    display               : table;
    table-layout          : fixed;
    width                 : 100%;
    padding               : 0;
}

ul.inquiryTableRow li {
    display               : table-cell;
    *display              : inline;
    *zoom                 : 1;
    margin                : 0;
    padding               : 0;
}

ul.inquiryTableRow li.inquiryTableColumnLeft {
    width                 : 280px;
    height                : 100%;
    line-height           : 100%;
    list-style-type       : none;
    vertical-align        : middle;
    padding               : 0 10px 0 0;
}

ul.inquiryTableRow li.inquiryTableColumnRight {
    padding               : 0 10px 0 0;
}

ul.inquiryTable .oddRow {
    width                 : 100%;
    background            : #ffffff;
    padding               : 7px 0;
}

ul.inquiryTable .evenRow {
    width                 : 100%;
    background            : #f2f2f2;
    padding               : 7px 0;
}

ul.inquiryTable .labelColumn {
    width                 : 100%;
    height                : 100%;
    margin                : 0 auto;
    padding               : 0;
    text-align            : right;
    font-weight           : bold;
}

ul.inquiryTable .valueColumn {
    width                 : 100%;
    margin                : 0;
    padding               : 0;
    word-break            : break-word;
}

ul.inquiryTable span.subLabel {
    font-size             : 10px;
}

ul.inquiryTable select {
    width                 : 100%;
    height                : 21px;
}

ul.inquiryTable input {
    height                : 25px;
    width                 : 100%;
    -moz-box-sizing       : border-box;
    -webkit-box-sizing    : border-box;
    box-sizing            : border-box;
}

ul.inquiryTable textarea {
    width                 : 100%;
    -moz-box-sizing       : border-box;
    -webkit-box-sizing    : border-box;
    box-sizing            : border-box;
    padding               : 2px;
}

span.requirdSymbol {
    color                 : red;
}

input:required:invalid, input:focus:invalid {
    background-color      : red;
}

input:required:valid {
    background-color      : white;
}

/* 完了 */
