@charset "UTF-8";


/*! 
============================================================
    Google検索
============================================================
*/

.page-structure-fixed-header form.gsc-search-box {
    max-width: 500px;
    margin: 0 auto;
}
.page-structure-scroll-content form.gsc-search-box {
    max-width: 640px;
    margin: 0 auto;
}
.page-structure-fixed-header input.gsc-input,
.page-structure-fixed-header .gsc-input-box,
.page-structure-fixed-header .gsc-input-box-hover,
.page-structure-fixed-header .gsc-input-box-focus,
.page-structure-scroll-content input.gsc-input,
.page-structure-scroll-content .gsc-input-box,
.page-structure-scroll-content .gsc-input-box-hover,
.page-structure-scroll-content .gsc-input-box-focus {
    border-color: var(--themeval-color-theme-gray-01);
}

.page-structure-scroll-content .gsc-above-wrapper-area {
    max-width: 100%;
}
.page-structure-scroll-content .gsc-wrapper {
    max-width: 100%;
}



.external-searchbox-preview {
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 12px 10px 12px 56px;
    background-color: var(--themeval-color-theme-white);
    background-image: url(../img/ico/ico_search.svg);
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: left 18px center;
    border: 1px solid var(--themeval-color-theme-gray-01);
    border-radius: 4px;
    color: var(--themeval-color-theme-gray-01);
    text-align: left;
    font-size: 16px;
    line-height: 2;
}
.page-structure-fixed-header .external-searchbox-preview {
    max-width: 500px;
}
.page-structure-scroll-content .external-searchbox-preview {
    max-width: 640px;
}
.external-searchbox-preview::before {
    content: "Google検索";
    display: inline-block;
}
.external-searchbox-preview::after {
    content: "※テストサイトでは利用できません。";
    display: inline-block;
    margin-left: 1em;
    color: var(--themeval-color-theme-18);
    font-size: 80%;
}

.external-searchresults-preview {
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 30vh 10px;
    background-color: var(--themeval-color-theme-white);
    border: 1px solid var(--themeval-color-theme-gray-01);
    border-radius: 4px;
    color: var(--themeval-color-theme-gray-01);
    text-align: center;
    font-size: 16px;
    line-height: 2;
}
.external-searchresults-preview::before {
    content: "ここにGoogle検索結果が表示されます。";
    display: block;
}
.external-searchresults-preview::after {
    content: "※テストサイトでは利用できません。";
    display: block;
    color: var(--themeval-color-theme-18);
    font-size: 80%;
}