/*******************************************************************************

  Project   : 特許申請代行サイト AFormsカスタマイズ
  Function  : WordPressフロントページ表示コンテンツ スタイルシート
              [クライアント様によるデザインカスタマイズ用]

*******************************************************************************/


.horizontal-scroll {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

/*----------------------------------------------------------*/
/*  見積もりフォーム                                        */
/*----------------------------------------------------------*/

.wq-Form .wq--label .wq-Option .wq--main wq--name {
    word-wrap: break-word;
}

.wq--head {
    background-color: #00B0EC;
}

.wq-Dialog {
    z-index: 1000;
}

.a2-form-phase-heading
{
	display: inline-block;
	font-size: 40px;
	color: #000000;
}

/* 金額をフォーム右側に段組み表示時の、列幅比率 */

#a2-form-columns .a2-form-left {
    flex-basis: 65%;
}

#a2-form-columns .a2-form-right {
    flex-basis: 35%;
}

/* フォーム下のボタン */

.wq-Form #wq-action .wq--header {
    width: 0;
}

.wq-Form #wq-action .wq--body .wq-InputGroup {
    justify-content: center;
}

/* 選択肢のサムネ画像が指定されていない場合に画像表示スペースを除去 */

.wq-Form #wq-hnavigator .wq-Selector .wq-Option .wq--media  {
    height: auto;
    max-height: 100px;
    margin-bottom: 0px;
}

.wq-Form #wq-hnavigator .wq-Selector .wq-Option .wq--media .wq-Image.wq-src-empty {
    display: none;
}

/* 選択肢に表示される金額を非表示 */

.wq-Form #wq-hnavigator .wq-Selector .wq-Option .wq--price {
    display: none;
}

/* 選択肢のレイアウト調整 */

@media (min-width: 783px) { /* 783pxはAFormsのブレークポイントに合わせる */
/*
    .wq-Form #wq-hnavigator .wq-Selector .wq-Option {
        width: auto;
        min-width: 200px;
    }
*/
}

/* アップロードファイル読み込み時のビジー表示 */
#a2-busy-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: rgba(0,0,0,0.2);
    display: flex;
    justify-content: center;
    align-items: center;
}

#a2-busy-overlay .busy-text {
    color: white;
    text-align: center;
}

#a2-busy-overlay .busy-text .fa {
    font-size: 30px;
}

/* 確認画面の不要部を除去 */
.wq-Form.wq-is-confirming .wq-Monitor .wq-for-category {
    display: none !important;
}

/* 国内移行期限入力欄の注意書きにHTMLタグを含めると、何故か確認画面に同欄が出現する
   --> 原因根治が困難な為、単に非表示にする */
.wq-Form.wq-is-confirming .wq--lead > button ~ [id^="wq-attr-"].wq-Control {
    display: none !important;
}

/*----------------------------------------------------------*/
/*  マイページ/サインアップなど共通                         */
/*----------------------------------------------------------*/

/* 簡易フォーム */

#a2-login-form.a2-simple-form {
    width: 280px;
    max-width: 100%;
    margin: 0 auto;
}

#a2-signup-form.a2-simple-form {
}

#a2-entry-form.a2-simple-form {
}


.a2-simple-form .tips {
    font-size: 13px;
    color: #888;
}

.a2-simple-form .busy {
    color: gray;
    font-size: 18px;
}

.a2-simple-form #a2-error-msg {
    color: red;
}

.button {
	font-size: 1.3rem;
 	font-weight: 500;
 	line-height: 1.3;
 	position: relative;
 	display: inline-block;
 	padding: 1rem 1rem;
 	cursor: pointer;
 		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
	user-select: none;
		-webkit-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	color: #212529;
}

button.wq-Button {
	padding: 10px 0 10px 0;
}

a.button {
	border: solid 1px #7A7A7A;
	background-color: #efefef;
	color: #7A7A7A;
}

a.button:hover {
	border: solid 1px #7A7A7A;
	background-color: #ccc;
	color: white;
}

#a2-logout-btn,.button-primary,#a2-customer-btn,#a2-reload-btn {
	font-size: 20px;
	font-weight: bold;
	padding: 10px 25px 10px 25px;
	border: solid 1px #7A7A7A;
	background-color: #efefef;
	color: #7A7A7A;
}

#a2-logout-btn:hover,.button-primary:hover,#a2-customer-btn:hover,#a2-reload-btn:hover {
	border: solid 1px #7A7A7A;
	background-color: #ccc;
	color: white;
}

/* マイページ設定 */
.article-header {
	margin-top: 50px;	
}

#a2-phase-entry {
	width: 600px;
	margin: 0 auto;
}

div#a2-mypage-ctrls {
	width: 1000px;
	margin: 0 auto;
}

.mypage-body {
	width: 1000px;
	margin: 0 auto;
}

.order-item {
	padding-top: 50px;
}

.mypage-foot {
	width: 1000px;
	margin: 0 auto;
}

h1.entry-title {
	display: none;
	margin-top: 20px;
}	

.form-row {
	font-weight: bold;
	color: #00B0EC;
	line-height: 2.1em;
	font-size: 1.3em;
}

#a2-submit-btn,.a2-order-btn,.a2-pay-btn {
	margin: 10px auto;
	font-size: 20px;
	font-weight: bold;
	width: 250px;
	padding: 10px 0 10px 0;
	background-color: #ff7800;
	color: white;
	border-width: 0px;
	border-radius: 40px;
}

#a2-submit-btn:hover,.a2-order-btn:hover,.a2-pay-btn:hover {
	background-color: rgba(255,120,0,0.5);		
}

.copyright {
	display: none;
}
#accountreg-div {
	width: 1000px;
	margin: 0 auto;
}

#a2-goto-btns {
	text-align: center;
}

/*----------------------------------------------------------*/
/*  マイページ                                              */
/*----------------------------------------------------------*/

/* 案件リスト */

#a2-mypage .mypage-head {
	padding: 0px 100px 0px 100px;
}

#a2-order-list .glossary {
	font-size: 14px;
}

mypage-head.button{
	
}

h2.a2-section-title {
	color: white;/*文字色*/
	background-color: #00B0EC;
	border: none;
	padding: 10px 25px 10px 25px;/*文字周りの余白*/
	margin: 0px;
	width: 700px;
}

#a2-order-list .order-item {
    border: solid 1px lightgray;
}

#a2-order-list .order-item .order-head {
    background: #f4f4f4;
	margin: 0px 100px 0px 100px;
	
	/* border-bottom: solid 1px lightgray; */
}

#a2-order-list .order-item .order-head .order-id {
    font-size: 25px;
    font-style: oblique;
	
}

#a2-order-list .order-item .order-body {
	background: white;
	margin: 0px 100px 0px 100px;
}

#a2-order-list .customer-attrs th {
    color: #444;
    font-size: 13px;
    font-weight: bold;
}

#a2-order-list .customer-attrs td {
    font-size: 17px;
}

#a2-order-list .wq--detailTable  {
    background: white;
}

#a2-order-list .wq--detailTable .wq-for-category {
    display: none;
}

.data-empty-msg {
    color: gray;
    font-style: oblique;
}

@media (max-width: 900px) {

    #a2-order-list .order-item .order-head .left,
    #a2-order-list .order-item .order-head .right {
        float: none;
    }

    #a2-order-list .order-item .order-head .left {
        flex-wrap: wrap;
    }

    #a2-order-list .order-item .order-head .status {
        width: auto;
    }

    #a2-order-list .order-item .order-head .status .order-stat {
        width: 200px;
    }

    #a2-order-list .order-item .order-head .status .reg-time br {
        display: none;
    }

    #a2-order-list .order-item .order-head .customer-info {
        margin-top: 20px;
        width: 100%;
    }

    #a2-order-list .order-item .order-head .customer-info .customer-attrs {
        width: auto;
        /*margin: 0 auto;*/
    }

    #a2-order-list .order-item .order-head .operation:not(:empty) {
        margin-top: 20px;
        text-align: center;
    }

    #a2-order-list .order-item .order-body {
        display: block;
    }

    #a2-order-list .order-item .order-body .quote .wq--detailTable {
        min-width: 400px;
    }

    #a2-order-list .order-item .order-body .file {
        width: 400px;
        max-width: 100%;
    }
}

/* 案件状態表示 */

#a2-order-list .order-stat-badge {
    display: block;
    padding: 6px 10px;
    font-size: 15px;
    line-height: 1;
    text-align: center;
    border-radius: 3px;
    box-shadow: 1px 1px 1px #ddd;
}

#a2-order-list .order-stat-chart {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 8px;
    border: solid 1px lightgray;
    background: white;
    text-align: center;
}

#a2-order-list .order-stat-chart .stat-phase {
    padding: 4px 6px;
    font-size: 15px;
    line-height: 1.1;
    border-radius: 3px;
    box-shadow: 1px 1px 1px #ddd;
}

#a2-order-list .order-stat-chart .stat-phase.current {
    box-shadow: 0 0 1px 1px #bbb;
    animation: kf_FIREFLY 0.5s ease-in-out infinite alternate both;
}

#a2-order-list .order-stat-chart .stat-phase.current .fa {
    color: #222;
}

#a2-order-list .order-stat-chart .arrow {
    margin: 2px 0;
    color: #aaa;
    font-size: 12px;
    line-height: 1;
}


/* アップロードファイル一覧 */

.a2-upload-files .file-item {
    padding: 6px 8px;
    border-radius: 2px;
    color: white;
}

.a2-upload-files .file-item.upload-by-customer {
    background: #00B0EC;
}

.a2-upload-files .file-item.upload-by-admin {
    background: slategray;
}

.a2-upload-files .file-item .file-name {
    font-size: 16px;
}

.a2-upload-files .file-item .upload-info {
    font-size: 12px;
    opacity: 0.6;
}

.a2-upload-files .file-empty {
    color: gray;
    font-style: oblique;
}

.a2-file-uploader .tips {
    color: #888;
}

/* 顧客情報登録 */

#a2-customer-register h2 .edit-btn {
    margin-left: 10px;
    padding: 5px 8px;
    line-height: 1;
    vertical-align: middle;
}

#a2-customer-register .form-row.require label:after {
    margin-left: 8px;
    content: "<Required>";
    font-size: 13px;
    font-weight: bold;
}

#a2-customer-register input:disabled,
#a2-customer-register textarea:disabled {
    background: white;
}

#a2-customer-register .tips {
    font-size: 13px;
    color: #888;
}

#a2-customer-register .error {
    font-size: 15px;
    color: red;
}

.a2-popup-window.a2-customer-reg-dialog {
    width: 500px;
}

#a2-customer-register .email-test {
    margin-top: 25px;
    text-align: center;
}

#a2-customer-register .email-test .email-test-btn {
    padding: 6px 10px;
    font-size: 15px;
    line-height: 1;
}

/* ページネーション */

.tablenav {
}

.tablenav .tablenav-pages {
    font-size: 14px;
}

.tablenav .tablenav-pages .displaying-num {
    padding-right: 10px;
}

.tablenav .tablenav-pages .pagination-links {
}

.tablenav .tablenav-pages .pagination-links .button {
    margin-left: -1px;
    padding: 0;
    width: 35px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tablenav .tablenav-pages .pagination-links a.button {
    border: solid 1px darkgray;
    background: gray;
    color: white;
    text-decoration: none;
}

.tablenav .tablenav-pages .pagination-links .button.disabled {
    border: solid 1px #f8f8f8;
    background: white;
    color: inherit;
}

.tablenav .tablenav-pages .pagination-links .paging-input {
    margin-left: 5px;
}

.tablenav .tablenav-pages .pagination-links .paging-input .current-page {
    width: 40px;
    height: 40px;
    line-height: 40px;
    padding: 0;
    text-align: center;
}

.tablenav .tablenav-pages .pagination-links .paging-input .tablenav-paging-text {
    padding: 0 10px 0 6px;
}