/*
 Theme Name: http://bt-agency.co.jp
 Description:
 Theme URI: 
 Author: Dteam
 Author URI: 
 Version: 
 License: 
 License URI: 
*/

@charset "UTF-8";

.cf:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}

.cf {
    display: inline-block;
}


/* Hides from IE Mac */

* html .cf {
    height: 1%;
}

.cf {
    display: block;
}

.hide_pc {
    display: none;
}

a {}

a.fade {
    transition: all 0.1s ease;
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
}

a.link {
    display: inline-block;
    min-width: 180px;
    height: 50px;
    line-height: 50px;
    text-decoration: none;
    color: #FFF;
    font-size: 14px;
    letter-spacing: 0.1em;
    position: relative;
    background: #f08855;
    background-image: linear-gradient(to right, #f08855 50%, #FFF 50%);
    background-position: 0 0;
    background-size: 200% auto;
    transition: .3s;
}

a.link::after {
    content: '+';
    position: absolute;
    right: 15px;
}

a.link:hover {
    background-position: -100% 0;
    color: #000;
}

.page.outline section.bg {
    position: relative;
}

span.anchor {
    position: absolute;
    top: -70px;
    height: 0;
    width: 0;
    visibility: hidden;
    opacity: 0;
}


/* fadein up */

.fadein-up {
    transition: 1.0s;
    opacity: 0;
    transform: translate(0, 60px);
    -webkit-transform: translate(0, 60px);
}

.fadein-up.on {
    opacity: 1.0;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
}

.drawer--navbarTopGutter {
    padding-top: 0;
}

.aligncenter {
    display: block;
    margin: 0 auto 10px auto;
}

.alignright {
    float: right;
    margin: 0 0 10px 10px;
}

.alignleft {
    float: left;
    margin: 0 10px 10px 0;
}

p {
    word-break: break-all;
}


/*hack for webfont
header,
main,
footer {
    transform: rotate(0.001deg);
}
*/

body {
    width: 100%;
    min-width: 1100px;
    font-size: 16px;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    font-family: 游ゴシック, YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
    color: #000;
}

main {
    min-height: 800px;
}

.inner_content {
    display: block;
    width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.transition {
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}


/* --------------- HEADER --------------- */

header.pc {
    padding: 25px 0;
    background: #FFF;
}

nav.gnav ul {
    float: right;
}

nav.gnav ul li {
    float: left;
    margin-left: 30px;
}

nav.gnav ul li a {
    display: inline-block;
    text-decoration: none;
    line-height: 50px;
    color: #000;
    font-weight: bold;
    position: relative;
}

nav.gnav ul li a::after {
    position: absolute;
    bottom: .5em;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background-color: #f08855;
    opacity: 0;
    transition: .2s;
}

nav.gnav ul li a:hover::after {
    bottom: .3em;
    opacity: 1;
}

.header_fixed header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    padding: 10px 0;
}


/* --------------- /HEADER --------------- */


/* --------------- HOME --------------- */

#home_main_img {
    width: 100%;
    height: 630px;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    overflow: hidden;
    text-align: center;
}

#home_main_img>img {
    display: inline-block;
    position: relative;
    margin-top: 165px;
    z-index: 3;
    opacity: 0;
    transition: all 10s ease;
    -webkit-transition: all 10s ease;
    -moz-transition: all 10s ease;
    -o-transition: all 10s ease;
}

#home_main_img>img.fade {
    opacity: 1.0;
}

#home_main_img>section {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
}

#home_main_img>section div {
    display: block;
    width: 100%;
    transform: scale(1.0);
    height: 630px;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    opacity: 1.0;
}

#home_main_img>section.fade div:last-child {
    transform: scale(1.1);
    opacity: 0;
}

#home_main_img>section div {
    transition: all 4.0s ease-in-out;
    -webkit-transition: all 4.0s ease-in-out;
    -moz-transition: all 4.0s ease-in-out;
    -o-transition: all 4.0s ease-in-out;
    background-size: cover;
    background-position: center;
}

#home_main_img>section div.img1 {
    background-image: url(../images/img_main01_pc.jpg);
}

#home_main_img>section div.img2 {
    background-image: url(../images/img_main02_pc.jpg);
}

#home_main_img>section div.img3 {
    background-image: url(../images/img_main03_pc.jpg);
}

#home_main_img h1,
#home_main_img h2 {
    position: relative;
    z-index: 10;
    color: #FFF;
    letter-spacing: 0.1em;
}

#home_main_img h1 {
    margin: 260px 0 30px;
    font-size: 50px;
    line-height: 1.7;
}

#home_main_img h2 {
    font-size: 20px;
}

#home_top_bn a {
    display: block;
    background-image: url(../images/bnr_dispatch_pc.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 980px;
    height: 200px;
    margin: 60px auto;
    box-shadow: 0px 3px 10px 1px rgba(158, 158, 158, 0.5);
}

#home_outline {
    background: #f8f8f8;
    padding: 140px 0 150px;
}

#home_outline>div {
    background: url(../images/img_outline.jpg);
    background-position: right 140px;
    background-repeat: no-repeat;
    padding-bottom: 140px;
}

#home_outline>div>div {
    background: #FFF;
    width: 550px;
    height: 500px;
    box-sizing: border-box;
    padding: 110px 60px 0 80px;
}

#home_outline>div>div h1 {
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 50px;
}

#home_outline>div>div h1 span {
    display: block;
    font-size: 16px;
    color: #f08855;
    margin-top: 35px;
}

#home_outline>div>div p {
    line-height: 2.0;
}

#home_outline>div>div p::before {
    content: '◆';
    color: #f08855;
    display: inline-block;
    margin-right: 0.5em;
}

#home_bn {
    padding: 50px 0;
}

#home_bn>div {
    width: 535px;
    height: 300px;
    float: left;
    margin-bottom: 30px;
}

#home_bn>div:first-child {
    margin-right: 30px;
}

#home_bn>div:last-child {
    width: 100%;
}


/* --------------- /HOME --------------- */


/* --------------- MAIN COMMON --------------- */

.bn>div {
    text-align: center;
    color: #FFF;
    width: 100%;
    height: 300px;
    box-sizing: border-box;
    padding-top: 100px;
}

.bn>div h1 {
    font-size: 40px;
    margin-bottom: 60px;
}

.bn>div a {
    text-align: center;
}

.bn .message {
    background-image: url(../images/bg_contact.jpg);
}

.bn .philosophy {
    background-image: url(../images/btnbg_philosophy.jpg);
}

.bn .recruit {
    background-image: url(../images/btnbg_recruit.jpg);
    text-align: right;
    padding: 80px 130px 0 0;
}

.bn .recruit h1 {
    color: #000;
}

#headline {
    background: #CCC;
    height: 400px;
    background-size: cover;
    background-position: center;
    text-align: center;
    color: #FFF;
}

#headline h1 {
    padding-top: 150px;
    font-size: 40px;
    letter-spacing: 0.1em;
}

#headline h1 span {
    display: block;
    padding-top: 30px;
    font-size: 20px;
}


/* --------------- /MAIN COMMON --------------- */


/* --------------- PAGE-OUTLINE --------------- */

.page.outline #headline {
    background-image: url(../images/bg_heading_outline.jpg);
}

.page.outline #title h1 {
    text-align: center;
    font-size: 30px;
    padding: 90px 0;
    line-height: 2.0;
}

.page.outline section.bg {
    background: #f8f8f8;
    background-position: center 100px;
    background-repeat: no-repeat;
    padding: 530px 0 100px;
}

.page.outline section.bg>section {
    background: #FFF;
    padding: 100px;
    box-sizing: border-box;
}

.page.outline section.bg>section h1,
.page.outline #page_benefits h1 {
    font-size: 40px;
    margin-bottom: 50px;
}

.page.outline section.bg>section h1 span,
.page.outline #page_benefits h1 span {
    font-size: 16px;
    display: block;
    margin-top: 30px;
}

.page.outline section.bg>section h2 {
    font-size: 30px;
    margin-bottom: 32px;
    line-height: 2.0;
}

.page.outline section.bg>section p {
    font-size: 14px;
    margin-bottom: 32px;
    line-height: 1.4;
}

.page.outline section.bg>section h3 {
    font-size: 20px;
    line-height: 2.0;
}

.page.outline section.bg>section h3 b {
    font-weight: bold;
}

.page.outline #page_benefits {
    margin: 120px auto;
    width: 900px;
}

.page.outline #page_benefits h2 {
    font-size: 30px;
    margin-bottom: 30px;
}

.page.outline #page_benefits p {
    font-size: 20px;
    margin-bottom: 60px;
    line-height: 1.7;
    padding-bottom: 50px;
    border-bottom: solid 1px #CCC;
}

.page.outline #page_bn {
    margin-bottom: 140px;
}

.page.outline #page_company {
    padding-bottom: 80px;
}

.page.outline #page_company img.logo {
    display: block;
    margin: 110px auto;
}

.page.outline #page_company table {
    width: 900px;
    margin: 0 auto 50px;
    line-height: 1.7;
    text-align: left;
}

.page.outline #page_company table tr th,
.page.outline #page_company table tr td {
    padding: 25px 45px;
    vertical-align: top;
}

.page.outline #page_company table tr:nth-child(2n-1) th,
.page.outline #page_company table tr:nth-child(2n-1) td {
    background: #f8f8f8;
}

.page.outline #page_company table tr th {
    width: 250px;
    box-sizing: border-box;
}

.page.outline section.bg#page_message {
    /*background-image: url(../images/img_massage.jpg);
    padding-bottom: 0;*/
    padding: 100px 0;
}

.page.outline section.bg#page_message p.img {
    text-align: center;
}

.page.outline section.bg#page_message p.img img {
    max-width: 350px;
    width: 100%;
}

@media screen and (min-width: 1100px) {
    .page.outline section.bg#page_message p.img {
        float: right;
        padding-left: 30px;
        /* margin-top: -190px; */
    }

    .page.outline section.bg#page_message .sp_only {
        display: none;
    }
}

@media screen and (max-width: 1099px) {
    .page.outline section.bg#page_message .pc_only {
        display: none;
    }
}

.page.outline section.bg#page_philosophy {
    background-image: url(../images/img_philosophy.jpg);
}

.page.outline section.bg#page_company {
    background-image: url(../images/img_companyinfo.jpg);
}

.page.outline #page_company table a,
#home_outline .inner_content div a {
    color: #000;
}

.page.outline #page_company table a,
#home_outline .inner_content div a:hover {
    color: #f08855;
}


/* --------------- /PAGE-OUTLINE --------------- */


/* --------------- PAGE-CONTACT --------------- */

.page.contact #headline,
.page.contact-confirm #headline,
.page.contact-thanks #headline {
    background-image: url(../images/bg_contact.jpg);
}

.page.contact #form,
.page.contact-confirm #form,
.page.contact-thanks #form {
    width: 800px;
    margin: 0 auto 100px;
}

.page.contact-confirm #form {
    margin-top: 90px;
}

.page.contact-thanks #form {
    text-align: center;
}

.page.contact #form>p,
.page.contact-confirm #form>p,
.page.contact-thanks #form>p {
    text-align: center;
    margin: 90px 0;
}

.page.contact-thanks #form>p,
.page.contact-confirm #form>p,
.page.contact-thanks #form>p {
    line-height: 2em;
}

.page.contact #form table,
.page.contact-confirm #form table {
    width: 100%;
    margin-bottom: 30px;
    text-align: left;
}

.page.contact #form table tr th,
.page.contact #form table tr td,
.page.contact-confirm #form table tr th,
.page.contact-confirm #form table tr td {
    vertical-align: top;
}

.page.contact #form table tr th,
.page.contact-confirm #form table tr th {
    width: 320px;
    font-size: 18px;
    color: #717171;
}

.page.contact #form table tr th span,
.page.contact-confirm #form table tr th span {
    display: inline-block;
    font-size: 14px;
    width: 50px;
    line-height: 25px;
    background: #f08855;
    color: #FFF;
    text-align: center;
    margin-right: 20px;
}

.page.contact #form table tr td,
.page.contact-confirm #form table tr td {
    padding-bottom: 40px;
}

.page.contact #form table tr td input,
.page.contact #form table tr td select,
.page.contact #form table tr td textarea,
.page.contact-confirm #form table tr td input,
.page.contact-confirm #form table tr td select,
.page.contact-confirm #form table tr td textarea {
    border: none;
    font-size: 18px;
    background: #f8f8f8;
    width: 100%;
    padding-left: .5em;
}

.page.contact #form table tr td input[type="text"],
.page.contact #form table tr td input[type="email"],
.page.contact #form table tr td input[type="tel"],
.page.contact #form table tr td select,
.page.contact-confirm #form table tr td input[type="text"],
.page.contact-confirm #form table tr td input[type="email"],
.page.contact-confirm #form table tr td input[type="tel"],
.page.contact-confirm #form table tr td select {
    border-radius: 0;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
}

.page.contact #form table tr td select,
.page.contact-confirm #form table tr td select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    background: none #f8f8f8;
    border: none;
    font-size: 18px;
    width: 100%;
    padding-left: .5em;
}

.page.contact #form table tr td textarea,
.page.contact-confirm #form table tr td textarea {
    resize: none;
}

.page.contact #form #agree,
.page.contact-confirm #form #agree {
    font-size: 14px;
    border: solid 1px #CCC;
    padding: 35px;
    color: #717171;
    line-height: 2.0;
}

.page.contact #form #agree ul,
.page.contact-confirm #form #agree ul {
    margin-left: 1.5em;
}

.page.contact #form #agree ul li,
.page.contact-confirm #form #agree ul li {
    list-style-type: disc;
}

.page.contact #form #agree a,
.page.contact-confirm #form #agree a {
    color: #717171;
}

.page.contact #form #acceptance,
.page.contact-confirm #form #acceptance {
    text-align: center;
    font-size: 14px;
    color: #717171;
    margin: 60px auto;
}

.page.contact #form #acceptance input[type="checkbox"],
.page.contact-confirm #form #acceptance input[type="checkbox"] {
    /*-webkit-appearance: none;*/
    background-color: #CCC;
    box-shadow: none;
    width: 15px;
    height: 15px;
    margin: 0 10px 0 0;
    vertical-align: text-bottom;
}

.page.contact #form #acceptance input[type="checkbox"]:checked,
.page.contact-confirm #form #acceptance input[type="checkbox"] {
    background-color: #f08855;
}

.page.contact #form #submit,
.page.contact-confirm #form #submit {
    text-align: center;
}

.page.contact #form #submit input,
.page.contact-confirm #form #submit input {
    width: 210px;
    line-height: 3.0;
    background-color: #f08855;
    color: #FFF;
    font-size: 16px;
    margin-left: 20px;
    letter-spacing: 0.1em;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

.page.contact #form #submit input:disabled,
.page.contact-confirm #form #submit input:disabled {
    background-color: #CCC;
    cursor: not-allowed;
}

.page.contact-confirm #form #submit input.wpcf7-previous {
    margin-left: 0;
    margin-bottom: 20px;
    color: #f08855;
    background-color: #fff;
    border: #f08855 1px solid;
}

.page.contact #form table tr td input[type="radio"] {
    width: auto;
}


/* --------------- /PAGE-CONTACT --------------- */


/* 20210914　追加 */


/* --------------- PAGE-SOUDAN FORM --------------- */

.page.soudan-form #headline,
.page.soudan-form-thanks #headline,
.page.soudan-form-confirm #headline {
    background-image: url(../images/bg_contact.jpg);
}

.page.soudan-form #form,
.page.soudan-form-thanks #form,
.page.soudan-form-confirm #form {
    width: 800px;
    margin: 0 auto 100px;
}

.page.soudan-form-thanks #form {
    text-align: center;
}

.page.soudan-form #form>p,
.page.soudan-form-thanks #form>p,
.page.soudan-form-confirm #form>p {
    text-align: center;
    margin: 90px 0;
}

.page.soudan-form-thanks #form>p,
.page.soudan-form-thanks #form>p {
    line-height: 2em;
}

.page.soudan-form #form table,
.page.soudan-form-confirm #form table {
    width: 100%;
    margin-bottom: 30px;
    text-align: left;
}

.page.soudan-form #form table tr th,
.page.soudan-form #form table tr td,
.page.soudan-form-confirm #form table tr th,
.page.soudan-form-confirm #form table tr td {
    vertical-align: top;
}

.page.soudan-form #form table tr th,
.page.soudan-form-confirm #form table tr th {
    width: 320px;
    font-size: 18px;
    color: #717171;
}

.page.soudan-form #form table tr th span,
.page.soudan-form-confirm #form table tr th span {
    display: inline-block;
    font-size: 14px;
    width: 50px;
    line-height: 25px;
    background: #009FD7;
    color: #FFF;
    text-align: center;
    margin-right: 20px;
}

.page.soudan-form #form table tr td,
.page.soudan-form-confirm #form table tr td {
    padding-bottom: 40px;
}

.page.soudan-form #form table tr td input,
.page.soudan-form #form table tr td select,
.page.soudan-form #form table tr td textarea,
.page.soudan-form-confirm #form table tr td input,
.page.soudan-form-confirm #form table tr td select,
.page.soudan-form-confirm #form table tr td textarea {
    border: none;
    font-size: 18px;
    background: #f8f8f8;
    width: 100%;
    padding-left: .5em;
}

.page.soudan-form #form table tr td input[type="text"],
.page.soudan-form #form table tr td input[type="email"],
.page.soudan-form #form table tr td input[type="tel"],
.page.soudan-form #form table tr td select,
.page.soudan-form-confirm #form table tr td input[type="text"],
.page.soudan-form-confirm #form table tr td input[type="email"],
.page.soudan-form-confirm #form table tr td input[type="tel"],
.page.soudan-form-confirm #form table tr td select {
    border-radius: 0;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
}

.page.soudan-form #form table tr td select,
.page.soudan-form-confirm #form table tr td select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    background: none #f8f8f8;
    border: none;
    font-size: 18px;
    width: 100%;
    padding-left: .5em;
}

.page.soudan-form #form table tr td textarea,
.page.soudan-form-confirm #form table tr td textarea {
    resize: none;
}

.page.soudan-form #form #agree,
.page.soudan-form-confirm #form #agree {
    font-size: 14px;
    border: solid 1px #CCC;
    padding: 35px;
    color: #717171;
    line-height: 2.0;
}

.page.soudan-form #form #agree ul,
.page.soudan-form-confirm #form #agree ul {
    margin-left: 1.5em;
}

.page.soudan-form #form #agree ul li,
.page.soudan-form-confirm #form #agree ul li {
    list-style-type: disc;
}

.page.soudan-form #form #agree a,
.page.soudan-form-confirm #form #agree a {
    color: #717171;
}

.page.soudan-form #form #acceptance,
.page.soudan-form-confirm #form #acceptance {
    text-align: center;
    font-size: 14px;
    color: #717171;
    margin: 60px auto;
}

.page.soudan-form #form #acceptance input[type="checkbox"],
.page.soudan-form-confirm #form #acceptance input[type="checkbox"] {
    /*-webkit-appearance: none;*/
    background-color: #CCC;
    box-shadow: none;
    width: 15px;
    height: 15px;
    margin: 0 10px 0 0;
    vertical-align: text-bottom;
}

.page.soudan-form #form #acceptance input[type="checkbox"]:checked,
.page.soudan-form-confirm #form #acceptance input[type="checkbox"]:checked {
    background-color: #009FD7;
}

.page.soudan-form #form #submit,
.page.soudan-form-confirm #form #submit {
    text-align: center;
}

.page.soudan-form #form #submit input,
.page.soudan-form-confirm #form #submit input {
    width: 210px;
    line-height: 3.0;
    background-color: #009FD7;
    color: #FFF;
    font-size: 16px;
    margin-left: 20px;
    letter-spacing: 0.1em;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

.page.soudan-form-confirm #form #submit input.wpcf7-previous {
    margin-left: 0;
    margin-bottom: 20px;
    color: #009FD7;
    background-color: #fff;
    border: #009FD7 1px solid;
}

.page.soudan-form #form #submit input:disabled,
.page.soudan-form-confirm #form #submit input:disabled {
    background-color: #CCC;
    cursor: not-allowed;
}

.page.soudan-form #form table tr td input[type="radio"],
.page.soudan-form-confirm #form table tr td input[type="radio"] {
    width: auto;
}


/* --------------- /PAGE-SOUDAN FORM --------------- */


/* 20220115　追加 */


/* --------------- PAGE-BRIEFING FORM --------------- */

.page.briefing-form #headline,
.page.briefing-form-thanks #headline {
    background-image: url(../images/bg_contact.jpg);
}

.page.briefing-form #form,
.page.briefing-form-thanks #form {
    width: 800px;
    margin: 0 auto 100px;
}

.page.briefing-form-thanks #form {
    text-align: center;
}

.page.briefing-form #form>p,
.page.briefing-form-thanks #form>p {
    text-align: center;
    margin: 90px 0;
}

.page.briefing-form-thanks #form>p,
.page.briefing-form-thanks #form>p {
    line-height: 2em;
}

.page.briefing-form #form table {
    width: 100%;
    margin-bottom: 30px;
    text-align: left;
}

.page.briefing-form #form table tr th,
.page.briefing-form #form table tr td {
    vertical-align: top;
}

.page.briefing-form #form table tr th {
    width: 320px;
    font-size: 18px;
    color: #717171;
}

.page.briefing-form #form table tr th span {
    display: inline-block;
    font-size: 14px;
    width: 50px;
    line-height: 25px;
    background: #009FD7;
    color: #FFF;
    text-align: center;
    margin-right: 20px;
}

.page.briefing-form #form table tr td {
    padding-bottom: 40px;
}

.page.briefing-form #form table tr td input,
.page.briefing-form #form table tr td select,
.page.briefing-form #form table tr td textarea {
    border: none;
    font-size: 18px;
    background: #f8f8f8;
    width: 100%;
    padding-left: .5em;
}

.page.briefing-form #form table tr td input[type="text"],
.page.briefing-form #form table tr td input[type="email"],
.page.briefing-form #form table tr td input[type="tel"],
.page.briefing-form #form table tr td input[type="date"],
.page.briefing-form #form table tr td select {
    border-radius: 0;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
}

.page.briefing-form #form table tr td select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    background: none #f8f8f8;
    border: none;
    font-size: 18px;
    width: 100%;
    padding-left: .5em;
}

.page.briefing-form #form table tr td textarea {
    resize: none;
}

.page.briefing-form #form #agree {
    font-size: 14px;
    border: solid 1px #CCC;
    padding: 35px;
    color: #717171;
    line-height: 2.0;
}

.page.briefing-form #form #agree ul {
    margin-left: 1.5em;
}

.page.briefing-form #form #agree ul li {
    list-style-type: disc;
}

.page.briefing-form #form #agree a {
    color: #717171;
}

.page.briefing-form #form #acceptance {
    text-align: center;
    font-size: 14px;
    color: #717171;
    margin: 60px auto;
}

.page.briefing-form #form #acceptance input[type="checkbox"] {
    /*-webkit-appearance: none;*/
    background-color: #CCC;
    box-shadow: none;
    width: 15px;
    height: 15px;
    margin: 0 10px 0 0;
    vertical-align: text-bottom;
}

.page.briefing-form #form #acceptance input[type="checkbox"]:checked {
    background-color: #009FD7;
}

.page.briefing-form #form #submit {
    text-align: center;
}

.page.briefing-form #form #submit input {
    width: 210px;
    line-height: 3.0;
    background-color: #009FD7;
    color: #FFF;
    font-size: 16px;
    margin-left: 20px;
    letter-spacing: 0.1em;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

.page.briefing-form #form #submit input:disabled {
    background-color: #CCC;
    cursor: not-allowed;
}

.page.briefing-form #form table tr td input[type="radio"] {
    width: auto;
}


/* --------------- /PAGE-BRIEFING FORM --------------- */


/* 20201210　追加 */


/* --------------- PAGE-EMPLOYMENT AGENCY ENTRY --------------- */

.page.employment-agency-entry #headline,
.page.employment-agency-entry-thanks #headline {
    background-image: url(../images/bg_contact.jpg);
}

.page.employment-agency-entry #form,
.page.employment-agency-entry-thanks #form {
    width: 800px;
    margin: 0 auto 100px;
}

.page.employment-agency-entry-thanks #form {
    text-align: center;
}

.page.employment-agency-entry #form>p,
.page.employment-agency-entry-thanks #form>p {
    text-align: center;
    margin: 90px 0;
}

.page.employment-agency-entry-thanks #form>p,
.page.employment-agency-entry-thanks #form>p {
    line-height: 2em;
}

.page.employment-agency-entry #form table {
    width: 100%;
    margin-bottom: 30px;
    text-align: left;
}

.page.employment-agency-entry #form table tr th,
.page.employment-agency-entry #form table tr td {
    vertical-align: top;
}

.page.employment-agency-entry #form table tr th {
    width: 320px;
    font-size: 18px;
    color: #717171;
}

.page.employment-agency-entry #form table tr th span {
    display: inline-block;
    font-size: 14px;
    width: 50px;
    line-height: 25px;
    background: #f08855;
    color: #FFF;
    text-align: center;
    margin-right: 20px;
}

.page.employment-agency-entry #form table tr td {
    padding-bottom: 40px;
}

.page.employment-agency-entry #form table tr td input,
.page.employment-agency-entry #form table tr td select,
.page.employment-agency-entry #form table tr td textarea {
    border: none;
    font-size: 18px;
    background: #f8f8f8;
    width: 100%;
    padding-left: .5em;
}

.page.employment-agency-entry #form table tr td input[type="text"],
.page.employment-agency-entry #form table tr td input[type="email"],
.page.employment-agency-entry #form table tr td input[type="tel"],
.page.employment-agency-entry #form table tr td select {
    border-radius: 0;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
}

.page.employment-agency-entry #form table tr td select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    background: none #f8f8f8;
}

.page.employment-agency-entry #form table tr td textarea {
    resize: none;
}

.page.employment-agency-entry #form #agree {
    font-size: 14px;
    border: solid 1px #CCC;
    padding: 35px;
    color: #717171;
    line-height: 2.0;
}

.page.employment-agency-entry #form #agree ul {
    margin-left: 1.5em;
}

.page.employment-agency-entry #form #agree ul li {
    list-style-type: disc;
}

.page.employment-agency-entry #form #agree a {
    color: #717171;
}

.page.employment-agency-entry #form #acceptance {
    text-align: center;
    font-size: 14px;
    color: #717171;
    margin: 60px auto;
}

.page.employment-agency-entry #form #acceptance input[type="checkbox"] {
    -webkit-appearance: none;
    background-color: #CCC;
    box-shadow: none;
    width: 15px;
    height: 15px;
    margin: 0 15px 0 0;
    vertical-align: text-bottom;
}

.page.employment-agency-entry #form #acceptance input[type="checkbox"]:checked {
    background-color: #f08855;
}

.page.employment-agency-entry #form #submit {
    text-align: center;
}

.page.employment-agency-entry #form #submit input {
    width: 210px;
    line-height: 3.0;
    background-color: #f08855;
    color: #FFF;
    font-size: 16px;
    margin-left: 20px;
    letter-spacing: 0.1em;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

.page.employment-agency-entry #form #submit input:disabled {
    background-color: #CCC;
    cursor: not-allowed;
}


/* --------------- /PAGE-EMPLOYMENT AGENCY ENTRY --------------- */


/* --------------- PAGE-PRIVACY & POLICY --------------- */

.page.privacy-policy #headline {
    background-image: url(../images/bg_contact.jpg);
}

.page.privacy-policy #main {
    width: 800px;
    margin: 100px auto 120px;
}

.page.privacy-policy #main h2 {
    border-bottom: solid 1px #CCC;
    padding-bottom: 20px;
    font-size: 25px;
    color: #000;
    margin-bottom: 20px;
}

.page.privacy-policy #main ol,
.page.privacy-policy #main p,
.page.privacy-policy #main dl {
    line-height: 2.0;
    font-size: 14px;
}

.page.privacy-policy #main ol {
    margin-bottom: 80px;
}

.page.privacy-policy #main ol li {
    margin-bottom: 30px;
    list-style: decimal;
    list-style-position: inside;
}

.page.privacy-policy #main p {
    margin-bottom: 60px;
}

.page.privacy-policy #main dl dt {
    color: #414141;
    font-size: 20px;
    margin-bottom: 20px;
    font-weight: bold;
}

.page.privacy-policy #main dl dd {
    margin-bottom: 50px;
}


/* --------------- /PAGE-PRIVACY & POLICY --------------- */


/* --------------- PAGE-SAMPLING --------------- */

#title_inner {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

#top_catch {
    animation-name: fadein;
    animation-duration: 2s;
    text-align: center;
}

#title .counter {
    animation-name: fadein;
    animation-duration: 4s;
    -webkit-animation: fadein 1s ease 1s 1 forwards;
    animation: fadein 1s ease1s 1 forwards;
    opacity: 0;
}

#title .experience {
    animation-name: fadein;
    animation-duration: 4s;
    -webkit-animation: fadein 1s ease 1.5s 1 forwards;
    animation: fadein 1s ease1.5s 1 forwards;
    opacity: 0;
}

@keyframes fadein {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#top_catch p {
    display: inline-block;
    position: relative;
    margin-top: 20%;
    margin-bottom: 3%;
    font-size: 80px;
    font-weight: bold;
}

#title .counter {
    font-size: 22px;
    font-weight: normal;
    text-align: center;
    background-color: #f1834dd6;
    padding: 20px;
    width: 300px;
    margin: 0 auto;
    border-radius: 5px;
}

#title {
    background-image: url(../images/sampling_main_pc.jpg);
    height: 630px;
    background-size: cover;
    background-position: center;
    color: #FFF;
}

#feature,
#promotion,
#cost {
    padding: 140px 0 150px;
}

#feature>div>div h1,
#cutomer>div>div h1,
#promotion>div>div h1,
#case>div>div h1,
#cost>div>div h1 {
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 50px;
}

#feature>div>div h1 span,
#cutomer>div>div h1 span,
#promotion>div>div h1 span,
#case>div>div h1 span,
#cost>div>div h1 span {
    display: block;
    font-size: 16px;
    color: #f08855;
    margin-top: 35px;
}

#feature>div>div p,
#cutomer>div>div p,
#promotion>div>div p,
#case>div>div p,
#cost>div>div p {
    line-height: 2.0;
    color: #303030;
}

.feature_box {
    margin: 0 auto;
    position: relative;
    margin-top: 60px;
    margin-bottom: 90px;
    text-align: center;
}

#promotion .promoimg .sp,
#feature .groupimg .sp,
#case .caseimg .sp,
#cutomer .cutomerimg .sp {
    display: none !important;
}

.groupimg,
.promoimg,
.caseimg,
.plan {
    margin: 0 auto;
    position: relative;
    margin-top: 60px;
    text-align: center;
}

.feature_box ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.subtitle {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    display: block;
    position: relative;
}

.subtitle span {
    background-image: linear-gradient(transparent 50%, #fde6db 50%);
}

#cutomer,
#case {
    padding: 140px 0 150px;
    background-color: #f8f8f8;
}

#cutomer .parts,
#case .parts {
    color: #f08855;
}

.ex_case {
    text-align: left;
    width: 900px;
    margin: 0 auto;
}

.ex_case .title {
    color: #f08855;
    padding-bottom: 20px;
    font-weight: bold;
}

.ex_case ul {
    border-top: 1px solid #202020;
    border-bottom: 1px solid #202020;
    letter-spacing: -.4em;
}

.ex_case li {
    padding: 20px;
    color: #303030;
    position: relative;
    letter-spacing: normal;
}

.ex_case ul .product,
.ex_case ul .target {
    border-right: 1px solid #202020;
    border-bottom: 1px solid #202020;
    width: calc(45%);
}

.ex_case ul .area,
.ex_case ul .goods {
    border-bottom: 1px solid #202020;
    width: calc(46%);
}

.ex_case ul .product,
.ex_case ul .area,
.ex_case ul .target,
.ex_case ul .goods {
    display: inline-block
}

.inner2 {
    width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

#cost table tr th {
    background: #f08855;
    color: #FFF;
    width: 150px;
    text-align: center;
    line-height: 1.4;
}

#cost table tr th,
#cost table tr td {
    border: solid 1px #CCC;
    padding: 30px 0;
}

#cost table tr td {
    font-weight: normal;
    background: #FFF;
}

#cost table tr th,
#cost table tr td {
    border: solid 1px #fff;
    padding: 30px 0;
    text-align: center;
}

#cost table tr td:nth-child(2n+0) {
    background: #f8f8f8;
}

#cost table tr td:nth-child(2n+1) {
    background: #fde6db;
}


/* --------------- ARCHIVE --------------- */

.news_archive {
    margin-top: 80px;
}

.news_archive article {
    width: 900px;
    margin: 0 auto 80px;
    border-top: solid 1px #C9CACA;
}

.news_archive article>section {
    border-bottom: solid 1px #C9CACA;
}

.news_archive article>section a {
    display: inline-block;
    padding: 30px 40px;
    text-decoration: none;
    color: #494544;
    width: 100%;
    box-sizing: border-box;
}

.news_archive article>section a h2 {
    position: relative;
}

.news_archive article>section a h2::after {
    content: '＞';
    display: inline-block;
    position: absolute;
    right: 0;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.news_archive article>section a:hover h2::after {
    right: -10px;
}

.news_archive article>section a .date {
    border-right: solid 1px #494544;
    padding-right: 10px;
    margin-right: 10px;
}

.news_archive article>section a .cat {
    margin-right: 40px;
}

.news_archive article>section a .cat.blog {
    color: #494544;
}

.news_archive article>section a .cat.news {
    color: #93a086;
}


/* ---------- PAGINATION ---------- */

nav.pagination {
    text-align: center;
    margin: 80px 0;
}

nav.pagination a {
    text-decoration: none;
    color: #494544;
}

nav.pagination .nav-links .page-numbers {
    display: inline-block;
    font-size: 16px;
    padding: 0 10px;
    min-width: 40px;
    height: 40px;
    line-height: 40px;
    box-sizing: border-box;
    margin: 0 5px;
    border: solid 1px #c5ccbe;
}

nav.pagination .nav-links .page-numbers:hover,
nav.pagination .nav-links .page-numbers.current {
    background-color: #93a086;
    color: #FFF;
    text-decoration: none;
}

nav.pagination .nav-links .page-numbers.dots,
nav.pagination .nav-links .page-numbers:hover.dots {
    border: none;
    color: #494544;
    background-color: transparent;
}

nav.pagination .nav-links .next,
nav.pagination .nav-links .prev {
    border: none;
    color: #93a086;
}


/* --------------- /ARCHIVE --------------- */


/* --------------- SINGLE --------------- */

body.single main>section>h1 {
    margin-top: 80px;
}

body.single main>section>h2 {
    width: 900px;
    margin: 0 auto 30px;
    padding: 30px 40px;
    text-decoration: none;
    color: #494544;
    box-sizing: border-box;
    border-top: solid 1px #C9CACA;
    border-bottom: solid 1px #C9CACA;
    line-height: 1.4;
    display: flex;
}

body.single main>section>h2 .date {
    border-right: solid 1px #494544;
    padding-right: 10px;
    margin-right: 10px;
    height: 1.4em;
}

body.single main>section>h2 .cat {
    margin-right: 40px;
}

body.single main>section>h2 .cat.blog {
    color: #494544;
}

body.single main>section>h2 .cat.news {
    color: #93a086;
}

body.single main>section>article {
    width: 820px;
    margin: 0 auto 80px;
    line-height: 3.0;
}

body.single main>section>article img {
    width: auto;
    max-width: 100%;
    height: auto;
}


/* ---------- NAVIGATION ---------- */

nav.navigation {
    text-align: center;
    margin: 80px 0;
}

nav.navigation a {
    text-decoration: none;
    color: #494544;
}

nav.navigation .nav-links>div {
    display: inline-block;
}

nav.navigation .nav-links>div a {
    display: inline-block;
    font-size: 16px;
    padding: 0 10px;
    min-width: 40px;
    height: 40px;
    line-height: 40px;
    box-sizing: border-box;
    margin: 0 5px;
    border: solid 1px #c5ccbe;
}

nav.navigation .nav-links>div a:hover {
    background-color: #93a086;
    color: #FFF;
}


/* --------------- /SINGLE --------------- */


/* --------------- FOOTER --------------- */

footer {}

footer>nav {
    padding: 70px 0 80px;
}

footer #copyright {
    background: #000;
    color: #FFF;
    font-size: 12px;
    line-height: 55px;
}

footer #copyright a {
    color: #FFF;
    float: right;
    text-decoration: none;
}

footer #copyright a:hover {
    text-decoration: underline;
}

#foot_contact {
    background-image: url(../images/bg_contact.jpg);
    background-size: cover;
    background-position: center;
    height: 380px;
    text-align: center;
    color: #FFF;
    letter-spacing: 0.1em;
}

#foot_contact h1 {
    font-size: 40px;
    padding: 85px 0 65px;
}

#foot_contact p {
    margin-bottom: 55px;
}


/* --------------- /FOOTER --------------- */


/* --------------- RESET iOS style --------------- */

main input[type="submit"],
main input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}

main input[type="submit"]::-webkit-search-decoration,
main input[type="button"]::-webkit-search-decoration {
    display: none;
}

main input[type="submit"]::focus,
main input[type="button"]::focus {
    outline-offset: -2px;
}


/* --------------- /RESET iOS style --------------- */


/* =============================================================================================================================================
															SMARTPHONE
============================================================================================================================================= */

@media screen and (max-width: 767px) {

    /* display:none */
    .hide_sp {
        display: none !important;
    }

    .hide_pc {
        display: inherit !important;
    }

    /* drawer */
    .drawer-navbar-header {
        text-align: left;
    }

    .drawer-navbar .drawer-brand {
        width: 40%;
        padding-left: 0;
    }

    .drawer-navbar .drawer-brand img {
        width: 100%;
        vertical-align: middle;
        margin-top: -0.2em;
    }

    .drawer-hamburger {
        padding: 12px 1rem 12px;
    }

    .drawer-hamburger-icon,
    .drawer-hamburger-icon:after,
    .drawer-hamburger-icon:before {
        background-color: #747474;
    }

    .drawer-hamburger-icon:before {
        top: -8px;
    }

    .drawer-hamburger-icon:after {
        top: 8px;
    }

    .drawer-navbar #menu_text {
        margin-top: 12px;
        display: inline-block;
        font-size: 0.5rem;
        font-weight: bold;
        color: #747474;
    }

    .drawer-open .drawer-navbar-header {
        box-shadow: 0px 0px 5px 2px #DDD;
    }

    .drawer-open .drawer-hamburger {
        padding-bottom: 2rem;
    }

    .drawer-open .drawer-hamburger-icon {
        margin-top: 15px;
    }

    .drawer-open #menu_text {
        display: none;
    }

    .drawer-nav {
        width: 100%;
    }

    .drawer--right .drawer-nav {
        right: -100%;
    }

    .drawer-navbar ul li {
        border-bottom: solid 1px #CCC;
    }

    .drawer-navbar ul li a {
        display: block;
        text-align: center;
        color: #000;
        padding: 1.5em 0;
        text-decoration: none;
        font-size: 5vw;
    }

    .drawer-navbar ul li a:hover {
        text-decoration: none;
    }

    a.more {
        width: 33%;
        font-size: 3vw;
    }

    span.anchor {
        top: -3.75rem;
    }

    body {
        min-width: inherit;
        margin-top: 3.75rem;
        font-size: 4vw;
    }

    .header_fixed header {
        padding: 0;
    }

    nav.gnav ul li a::after {
        display: none;
    }

    .inner_content {
        width: 100%;
    }

    img {
        max-width: 100%;
    }

    .drawer-navbar {
        z-index: 100;
    }

    #home_main_img,
    #home_main_img>section div {
        height: 80vw;
    }

    #home_main_img h1 {
        margin: 50vw 0 5vw;
        font-size: 6vw;
    }

    #home_main_img h2 {
        font-size: 3vw;
    }

    #home_main_img>section div.img1 {
        background-image: url(../images/img_main01_sp.jpg);
    }

    #home_main_img>section div.img2 {
        background-image: url(../images/img_main02_sp.jpg);
    }

    #home_main_img>section div.img3 {
        background-image: url(../images/img_main03_sp.jpg);
    }

    #home_top_bn a {
        background-image: url(../images/bnr_dispatch_sp.jpg);
        width: auto;
        height: 0;
        margin: 5%;
        padding: 80% 5% 0;
        box-shadow: none;
    }

    #home_outline {
        padding: 0;
    }

    #home_outline>div>div {
        width: 100%;
    }

    #home_bn>div {
        width: 100%;
        float: none;
    }

    #home_outline>div {
        background: url(../images/img_outline.jpg);
        background-position: center bottom;
        background-size: 100%;
        padding-bottom: 71.428%;
    }

    #home_outline>div>div {
        width: 100%;
        padding: 15% 6%;
        height: auto;
    }

    #home_outline>div>div h1 {
        font-size: 10vw;
        font-weight: normal;
        margin-bottom: 10%;
    }

    #home_outline>div>div h1 span {
        font-size: 4.5vw;
        margin-top: 5%;
    }

    #home_bn {
        padding: 6% 0 0;
        box-sizing: border-box;
    }

    #home_bn>div {
        height: 0;
        padding: 0;
        padding-bottom: 56.074%;
        width: 92%;
        margin: 0 auto 15%;
    }

    #home_bn>div:first-child {
        margin-right: auto;
    }

    .bn>div {
        position: relative;
    }

    .bn>div h1 {
        font-size: 7vw;
        margin: 0;
        padding-top: 20%;
    }

    .bn>div a {
        position: absolute;
        bottom: -25px;
        left: 20%;
        width: 60%;
        min-width: auto;
        font-size: 4vw;
    }

    .bn .recruit {
        height: 0;
        padding: 0;
        padding-bottom: 56.074%;
        text-align: center;
        background-size: 205%;
        background-position: 16%;
    }

    .bn .recruit h1 {
        padding-top: 4%;
    }

    .bn .message {
        background-size: cover;
    }

    #headline {
        height: 0;
        padding-bottom: 40%;
    }

    #headline h1 {
        padding-top: 12%;
        font-size: 7vw;
    }

    #headline h1 span {
        padding-top: 5%;
        font-size: 3.5vw;
    }

    .page.outline #title h1 {
        font-size: 5vw;
        padding: 12% 10%;
    }

    .page.outline section.bg#page_message {
        margin-top: 5%;
    }

    .page.outline section.bg {
        background-position: top center;
        background-size: 130%;
        padding: 46% 0 20%;
    }

    .page.outline section.bg#page_message {
        padding: 6% 0 20%;
    }

    .page.outline section.bg>section {
        padding: 15% 6%;
        width: 94%;
    }

    .page.outline section.bg>section h1,
    .page.outline #page_benefits h1 {
        font-size: 7vw;
        text-align: center;
        margin-bottom: 5%;
    }

    .page.outline section.bg>section h1 span,
    .page.outline #page_benefits h1 span {
        font-size: 4vw;
        margin-top: 5%;
    }

    .page.outline section.bg>section h2 {
        font-size: 5vw;
        margin-bottom: 7%;
    }

    .page.outline section.bg>section h3 {
        font-size: 4vw;
        line-height: 1.7;
    }

    .page.outline #page_benefits {
        width: 82%;
        margin: 20% auto;
    }

    .page.outline #page_benefits h2 {
        text-align: center;
        font-size: 5vw;
        margin: 15% 0 10%;
    }

    .page.outline #page_benefits p {
        font-size: 4vw;
        margin-bottom: 15%;
        padding-bottom: 12%;
    }

    .page.outline #page_bn {
        margin-bottom: 25%;
    }

    .page.outline #page_company {
        padding-bottom: 15%;
    }

    .page.outline #page_company img.logo {
        margin: 15% auto;
    }

    .page.outline #page_company table,
    .page.outline #page_company table tbody,
    .page.outline #page_company table tr,
    .page.outline #page_company table tr th,
    .page.outline #page_company table tr td {
        display: block;
        border: none;
    }

    .page.outline #page_company table {
        width: 100%;
        margin-bottom: 5%;
    }

    .page.outline #page_company table tr:nth-child(2n-1) th,
    .page.outline #page_company table tr:nth-child(2n-1) td {
        background: inherit;
    }

    .page.outline #page_company table tr:nth-child(2n-1) th,
    .page.outline #page_company table tr th {
        width: 100%;
        background: #f8f8f8;
        padding: 5% !important;
        height: auto;
    }

    .page.outline #page_company table tr th,
    .page.outline #page_company table tr td {
        font-size: 3.5vw;
        padding: 3% 5%;
    }

    .page.outline #page_company table tr td {
        padding: 5% 5%;
    }

    .page.outline #page_company iframe {
        width: 100%;
        height: 250px;
    }

    .page.contact #form>p,
    .page.contact-confirm #form>p {
        line-height: 2.0;
        margin: 15% 0;
    }

    .page.contact #form,
    .page.contact-confirm #form,
    .page.contact-thanks #form {
        width: 82%;
        margin-bottom: 15%;
    }

    .page.contact #form table,
    .page.contact-confirm #form table {
        margin-bottom: 0;
    }

    .page.contact #form table,
    .page.contact #form table tbody,
    .page.contact #form table tr,
    .page.contact #form table tr th,
    .page.contact #form table tr td,
    .page.contact-confirm #form table,
    .page.contact-confirm #form table tbody,
    .page.contact-confirm #form table tr,
    .page.contact-confirm #form table tr th,
    .page.contact-confirm #form table tr td {
        display: block;
        border: none;
    }

    .page.contact #form table tr th,
    .page.contact-confirm #form table tr th {
        width: 100%;
        font-size: 4vw;
        padding-bottom: 5%;
    }

    .page.contact #form table tr td,
    .page.contact-confirm #form table tr td {
        padding-bottom: 15%;
    }

    .page.contact #form table tr td input,
    .page.contact #form table tr td select,
    .page.contact #form table tr td textarea,
    .page.contact-confirm #form table tr td input,
    .page.contact-confirm #form table tr td select,
    .page.contact-confirm #form table tr td textarea {
        font-size: 4vw;
        box-sizing: border-box;
    }

    .page.contact #form #agree {
        font-size: 3vw;
        padding: 5%;
    }

    .page.contact #form #acceptance {
        font-size: 3.5vw;
        margin: 15% auto 20%;
    }

    .page.contact #form #acceptance input[type="checkbox"] {
        width: 3.5vw;
        height: 3.5vw;
        margin: 0 0.7em 0 0;
    }

    .page.contact #form #submit input,
    .page.contact-confirm #form #submit input {
        width: 70%;
        line-height: 3.5;
        font-size: 5vw;
    }

    /*-----20210914　追加------------------------------------------------------*/
    .page.soudan-form #form>p,
    .page.soudan-form-confirm #form>p {
        line-height: 2.0;
        margin: 15% 0;
    }

    .page.soudan-form #form,
    .page.soudan-form-thanks #form,
    .page.soudan-form-confirm #form,
    .page.soudan-form-confirm-thanks #form {
        width: 82%;
        margin-bottom: 15%;
    }

    .page.soudan-form #form table,
    .page.soudan-form-confirm #form table {
        margin-bottom: 0;
    }

    .page.soudan-form #form table,
    .page.soudan-form #form table tbody,
    .page.soudan-form #form table tr,
    .page.soudan-form #form table tr th,
    .page.soudan-form #form table tr td,
    .page.soudan-form-confirm #form table,
    .page.soudan-form-confirm #form table tbody,
    .page.soudan-form-confirm #form table tr,
    .page.soudan-form-confirm #form table tr th,
    .page.soudan-form-confirm #form table tr td {
        display: block;
        border: none;
    }

    .page.soudan-form #form table tr th,
    .page.soudan-form-confirm #form table tr th {
        width: 100%;
        font-size: 4vw;
        padding-bottom: 5%;
    }

    .page.soudan-form #form table tr td,
    .page.soudan-form-confirm #form table tr td {
        padding-bottom: 15%;
    }

    .page.soudan-form #form table tr td input,
    .page.soudan-form #form table tr td select,
    .page.soudan-form #form table tr td textarea,
    .page.soudan-form-confirm #form table tr td input,
    .page.soudan-form-confirm #form table tr td select,
    .page.soudan-form-confirm #form table tr td textarea {
        font-size: 4vw;
        box-sizing: border-box;
    }

    .page.soudan-form #form #agree,
    .page.soudan-form-confirm #form #agree {
        font-size: 3vw;
        padding: 5%;
    }

    .page.soudan-form #form #acceptance,
    .page.soudan-form-confirm #form #acceptance {
        font-size: 3.5vw;
        margin: 15% auto 20%;
    }

    .page.soudan-form #form #acceptance input[type="checkbox"],
    .page.soudan-form-confirm #form #acceptance input[type="checkbox"] {
        width: 3.5vw;
        height: 3.5vw;
        margin: 0 0.7em 0 0;
    }

    .page.soudan-form #form #submit input,
    .page.soudan-form-confirm #form #submit input {
        width: 70%;
        line-height: 3.5;
        font-size: 5vw;
    }

    /*-----20220115 説明会ページ　SP　追加------------------------------------------------------*/
    .page.briefing-form #form>p {
        line-height: 2.0;
        margin: 15% 0;
    }

    .page.briefing-form #form,
    .page.briefing-form-thanks #form {
        width: 82%;
        margin-bottom: 15%;
    }

    .page.briefing-form #form table {
        margin-bottom: 0;
    }

    .page.briefing-form #form table,
    .page.briefing-form #form table tbody,
    .page.briefing-form #form table tr,
    .page.briefing-form #form table tr th,
    .page.briefing-form #form table tr td {
        display: block;
        border: none;
    }

    .page.briefing-form #form table tr th {
        width: 100%;
        font-size: 4vw;
        padding-bottom: 5%;
    }

    .page.briefing-form #form table tr td {
        padding-bottom: 15%;
    }

    .page.briefing-form #form table tr td input,
    .page.briefing-form #form table tr td select,
    .page.briefing-form #form table tr td textarea {
        font-size: 4vw;
        box-sizing: border-box;
    }

    .page.briefing-form #form #agree {
        font-size: 3vw;
        padding: 5%;
    }

    .page.briefing-form #form #acceptance {
        font-size: 3.5vw;
        margin: 15% auto 20%;
    }

    .page.briefing-form #form #acceptance input[type="checkbox"] {
        width: 3.5vw;
        height: 3.5vw;
        margin: 0 0.7em 0 0;
    }

    .page.briefing-form #form #submit input {
        width: 70%;
        line-height: 3.5;
        font-size: 5vw;
    }

    /*-----20201210　追加------------------------------------------------------*/
    .page.employment-agency-entry #form>p {
        line-height: 2.0;
        margin: 15% 0;
    }

    .page.employment-agency-entry #form {
        width: 82%;
        margin-bottom: 15%;
    }

    .page.employment-agency-entry #form table {
        margin-bottom: 0;
    }

    .page.employment-agency-entry #form table,
    .page.employment-agency-entry #form table tbody,
    .page.employment-agency-entry #form table tr,
    .page.employment-agency-entry #form table tr th,
    .page.employment-agency-entry #form table tr td {
        display: block;
        border: none;
    }

    .page.employment-agency-entry #form table tr th {
        width: 100%;
        font-size: 4vw;
        padding-bottom: 5%;
    }

    .page.employment-agency-entry #form table tr td {
        padding-bottom: 15%;
    }

    .page.employment-agency-entry #form table tr td input,
    .page.employment-agency-entry #form table tr td select,
    .page.employment-agency-entry #form table tr td textarea {
        font-size: 4vw;
        box-sizing: border-box;
    }

    .page.employment-agency-entry #form #agree {
        font-size: 3vw;
        padding: 5%;
    }

    .page.employment-agency-entry #form #acceptance {
        font-size: 3.5vw;
        margin: 15% auto 20%;
    }

    .page.employment-agency-entry #form #acceptance input[type="checkbox"] {
        width: 3.5vw;
        height: 3.5vw;
        margin: 0 0.7em 0 0;
    }

    .page.employment-agency-entry #form #submit input {
        width: 70%;
        line-height: 3.5;
        font-size: 5vw;
    }

    /*-----20201210　追加　//------------------------------------------------------*/
    .page.privacy-policy #main {
        width: auto;
        margin: 10% auto;
        padding: 0 5%;
    }

    #foot_contact {
        height: auto;
        padding-bottom: 15%;
    }

    #foot_contact h1 {
        font-size: 7vw;
        padding: 15% 0 10%;
    }

    #foot_contact p {
        margin-bottom: 10%;
        font-size: 4vw;
        line-height: 2.0;
    }

    footer {
        text-align: center;
    }

    footer .logo {
        display: inline-block;
        margin: 8% 0;
    }

    footer .logo img {
        width: 70%;
    }

    footer nav.gnav {
        padding: 0;
    }

    footer nav.gnav ul {
        width: 100%;
        float: none;
    }

    footer nav.gnav ul li {
        width: 50%;
        margin: 0;
        border-top: solid 1px #CCC;
        box-sizing: border-box;
    }

    footer nav.gnav ul li:nth-child(2n) {
        border-left: solid 1px #CCC;
    }

    footer nav.gnav ul li:last-child {
        width: 100%;
    }

    footer nav.gnav ul li a {
        display: inline-block;
        background: #f8f8f8;
        width: 100%;
        line-height: 5;
        font-size: 3vw;
    }

    footer #copyright {
        font-size: 3vw;
        line-height: 2.0;
        padding: 5% 0;
    }

    footer #copyright a {
        display: block;
        float: none;
    }

    /* --------------- PAGE-SAMPLING --------------- */
    #title_inner {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
    }

    #top_catch {
        animation-name: fadein;
        animation-duration: 2s;
    }

    #title .counter {
        animation-name: fadein;
        animation-duration: 4s;
        -webkit-animation: fadein 1s ease 1s 1 forwards;
        animation: fadein 1s ease1s 1 forwards;
        opacity: 0;
    }

    #title .experience {
        animation-name: fadein;
        animation-duration: 4s;
        -webkit-animation: fadein 1s ease 1.5s 1 forwards;
        animation: fadein 1s ease1.5s 1 forwards;
        opacity: 0;
    }

    #top_catch p {
        display: inline-block;
        position: relative;
        margin-top: 25%;
        margin-bottom: 5%;
        font-size: 10vw;
        font-weight: bold;
        letter-spacing: -0.1em;
    }

    #title .counter {
        font-size: 3.5vw;
        font-weight: normal;
        text-align: center;
        background-color: #f1834dd6;
        padding: 10px;
        width: 53%;
        margin: 0 auto;
        border-radius: 2px;
    }

    #title {
        background-image: url(../images/sampling_main_pc.jpg);
        height: 80vw;
        background-size: cover;
        background-position: center;
        color: #FFF;
    }

    #feature,
    #promotion,
    #cost {
        padding: 15% 6%;
    }

    #cutomer,
    #case {
        padding: 15% 6%;
        background-color: #f8f8f8;
    }

    #feature>div>div h1,
    #cutomer>div>div h1,
    #promotion>div>div h1,
    #case>div>div h1,
    #cost>div>div h1 {
        font-size: 8vw;
        font-weight: normal;
        margin-bottom: 10%;
        line-height: 1.2;
    }

    #feature>div>div h1 span,
    #cutomer>div>div h1 span,
    #promotion>div>div h1 span,
    #case>div>div h1 span,
    #cost>div>div h1 span {
        font-size: 4vw;
        margin-top: 5%;
    }

    #feature .groupimg .sp,
    #promotion .promoimg .sp,
    #case .caseimg .sp,
    #cutomer .cutomerimg .sp {
        display: block !important;
    }

    #feature .groupimg .pc,
    #promotion .promoimg .pc,
    #case .caseimg .pc,
    #cutomer .cutomerimg .pc {
        display: none !important;
    }

    .feature_box {
        margin: 0 auto;
        position: relative;
    }

    .feature_box li {
        margin: 0 auto;
        text-align: center;
    }

    .feature_box img {
        width: 80%;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .groupimg,
    .promoimg,
    .cutomerimg,
    .caseimg,
    .plan {
        margin: 0 auto;
        position: relative;
        margin-top: 30px;
        text-align: center;
    }

    .subtitle {
        font-size: 6vw;
        position: relative;
        margin-top: 10%;
        line-height: 1.2;
    }

    .subtitle span {
        background-image: linear-gradient(transparent 50%, #fde6db 50%);
    }

    #cutomer .parts,
    #case .parts {
        color: #f08855;
    }

    .ex_case {
        text-align: left;
        width: 100%;
        margin: 0 auto;
    }

    .ex_case .title {
        color: #f08855;
        padding-bottom: 20px;
        font-weight: bold;
    }

    .ex_case ul {
        border-top: 1px solid #202020;
        border-bottom: none;
        letter-spacing: -.4em;
    }

    .ex_case li {
        padding: 20px 10px 20px 10px;
        border-bottom: 1px solid #202020;
        color: #303030;
        position: relative;
        letter-spacing: normal;
        font-size: 3vw;
    }

    .ex_case ul .product,
    .ex_case ul .target {
        border-right: none;
        border-bottom: 1px solid #202020;
        width: 94%;
    }

    .ex_case ul .area,
    .ex_case ul .goods {
        border-bottom: 1px solid #202020;
        width: 94%;
    }

    .ex_case ul .product,
    .ex_case ul .area,
    .ex_case ul .target,
    .ex_case ul .goods {
        display: inline-block
    }

    .ex_case li:before {
        padding: 0 10px;
        color: #202020;
        position: absolute;
        left: 0;
    }

    .inner2 {
        width: auto;
        margin-left: auto;
        margin-right: auto;
    }

    #cost table {
        width: 100%;
    }

    #cost table tr {
        display: block;
        float: left;
    }

    #cost table tr td,
    table tr th {
        display: block;
        height: 20px;
        width: auto !important;
        padding: 12% 0 9% !important;
        letter-spacing: 0.12em;
    }

    #cost table thead {
        display: block;
        float: left;
        width: 30%;
    }

    #cost table thead tr {
        width: 100%;
    }

    #cost table tbody {
        display: block;
        float: left;
        width: 100%;
    }

    #cost table tbody tr {
        width: 50%;
    }

    #cost table tr td:nth-child(2n+0) {
        background: #f8f8f8;
    }

    #cost table tr td:nth-child(2n+1) {
        background: #fde6db;
    }
}

/* --------------- /202408更新　HOME --------------- */
.home main {
    background-color: #F8F8F8;
}

#home_main_img {
    height: auto;
}

#home_main_img img {
    width: 100%;
    margin: 3rem auto;
}

#home_main_massage p {
    text-align: center;
    font-size: 1rem;
    margin-top: 2rem;
}

.home_wrap {
    margin-top: 6rem;
}

#home_value {
    margin-bottom: 3rem;
}

.home_wrap .inner_content {
    background-color: #fff;
    position: relative;
}

.home_wrap h1 {
    font-size: 4rem;
    font-weight: bold;
    line-height: 1.75rem;
    position: absolute;
    top: -1rem;
}

.home_wrap h1 span {
    font-size: 1.25rem;
    color: #F08855;
}

.home_wrap h2 {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 2rem;
}

.home_wrap ul .img {
    text-align: center;
}

.home_wrap ul li img {
    max-width: 100%;
}

.home_wrap .text {
    line-height: 1.75rem;
}

/*PC*/
@media screen and (min-width: 1100px) {
    #home_main_massage .inner_content {
        background: url(../images/img_bodycare_pc.png) no-repeat left, url(../images/img_refle_pc.png) no-repeat right;
        background-size: 15vw;
    }

    #home_main_massage p {
        line-height: 2.5rem;
    }

    .home_wrap ul li {
        display: inline-block;
        width: calc(50% - 2rem);
        vertical-align: middle;
    }

    .home_wrap ul li img {
        max-height: 12rem;
        padding-left: 3rem;
    }

    #home_vision ul li img {
        padding-left: 0;
    }

    .home_wrap .inner_content {
        position: relative;
        padding: 4rem 2rem 6rem 2rem;
        box-shadow: -1000px 0 0 0 #fff;
        width: calc(1100px - 4rem);
        height: 12rem;
    }

    #home_vision .inner_content {
        position: relative;
        box-shadow: 1000px 0 0 0 #fff;
    }
}

@media screen and (max-width: 1099px) {
    #home_main_img img {
        width: 94%;
    }

    #home_main_massage .inner_content {
        background: url(../images/img_bodycare_refle_sp.png) no-repeat right 10% bottom;
        background-size: auto 5rem;
        padding-bottom: 5.5rem;
    }

    #home_main_massage p {
        text-align: left;
        width: 94%;
        margin: 0 auto;
        font-size: 0.85rem;
        line-height: 2rem;
    }

    .home_wrap .inner_content {
        width: 94%;
        margin: 0 auto;
        font-size: 0.9rem;
    }

    .home_wrap ul {
        padding: 15% 6% 0 6%;
    }

    .home_wrap ul li {
        width: 94%;
        margin: 0 auto;
    }

    .home_wrap ul .img {
        width: 100%;
    }

    .home_wrap ul li img {
        max-width: 94%;
        max-height: 8rem;
        padding: 2rem 0;
        margin: 0 auto;
    }

    .home_wrap h1 {
        font-size: 3rem;
    }

    .home_wrap h1 span {
        font-size: 1rem;
    }

    .home_wrap h2 {
        font-size: 1.25rem;
        padding-top: 1rem;
    }
}

/*スマホヘッダー　リクルートボタン追加*/
@media screen and (max-width: 767px) {
    .drawer-navbar .drawer-navbar-header .recruit_btn {
        display: inline-block;
        width: 20%;
        text-align: center;
        padding: 0.5em;
        font-size: 12px;
        color: #fff;
        text-decoration: none;
        position: fixed;
        top: 1em;
        background: #F08855;
        right: 70px;
    }
}