/* PC、スマホ共通スタイル */
body {
    font-family: 'M PLUS 1','Noto Sans JP',"Source Sans Pro", "Hiragino Kaku Gothic ProN", Meiryo, Arial,
        sans-serif;    
}
input {
    cursor: pointer;
}
/*================
 PC用のスタイル
=================*/
@media screen and (min-width: 768px) {
    /*見出し*/
    h2 {
        margin: 40px 0 0 0;
    }

    h2::after {
        content: url("images/line.png");
        margin-left: 10px;
    }

    h3 {
        font-size: 27px;
    }

    /* セクションタイトル */
    #section-top {
        height: 246px;
        width: 100%;
        /*background-image: url("../image/26089.jpg");
        background-repeat: no-repeat;
        background-size: 130%;
        background-position: left 60%;
        */
        text-align: center;
        border-bottom: 1px solid #ddd;
    }

    #section-top-title {
        /*background-color: #8B5E3C;*/
        /*width: 368px;*/
        /*color: #F7F2ED;*/
        color: #444444;
        /*height: 296px;*/
        /*border-radius: 0 248px 248px 0;*/
        position: relative;
        letter-spacing: 0.1em;
    }
    #section-top-title > h1 {
        /*position: absolute;
        top: 0;
        left: 100px;*/
        font-size: 45px;
        /*letter-spacing: 01em;*/
    }

    #section-top-title > span {
        /*position: absolute;
        top: 200px;*/
        /*left: 100px;*/
        font-size: 26px;
        letter-spacing: 0.3em;
    }

    #section-top-title > div {
        position: absolute;
        top: 350px;
        left: 100px;
        font-size: 16px;
    }
    /* お問い合わせ */
    #contact-form {
        /*display: flex;
        justify-content: center; */
        text-align:center;
        width: 412px;
        margin: 0 auto;
    }
    #contact-form p {
        text-align:left;        
    }
    #submit_area p {
        text-align:center;
        line-height: 2.4rem;   
    }        
    span.wpcf7-spinner {
        display: none;
    }    
    input[type="submit"].contact_submit_btn {
        background-color: #fff;
        border: solid 2px #4E342E;
        color: #4E342E;
        padding: 10px 30px;
        text-decoration: none;
        font-size: 1em;
    }
    input[type="submit"].contact_submit_btn :hover {
        color: #4E342E;
        background-color: #b0e0e6;
    }    
    input[type="text"],input[type="email"] {
        font-size:1.0rem;
        padding-left:0.6rem;
        margin:3px 0;
        display:inline-block;
        height:2rem;
    }
    input[type="email"] {
        ime-mode: disabled;
    }
    input.wpcf7-text {
        display:inline-block;
        height:2rem;
    }
    
    textarea {
        font-size:1.0rem;
        padding-left: 0.6rem;    
        line-height: 1.5rem;
        margin:3px 0;
    }
    .required::after {
        content: "必須";
        color: #ffffff;
        background: #cc0000;
        font-size: 0.7rem;
        padding: 2px 5px;
        border-radius: 0.5rem;
        margin-left:0.3rem;
    }
    #contact_exp {
        margin-bottom:2rem;
    }
    #contact_exp > p {
        display:block;
        text-align:center;
    }
    
}

/*====================
 スマートフォン用のスタイル
=====================*/
@media screen and (max-width: 767px) {
    /* ヘッダー */
    header {
        height: 48px;
    }
 
    /*見出し*/
    h2::after {
        content: url("images/line.png");
        /*margin-left: 10px;*/
    }
    section > h2 {
        font-size: 1.2rem;
    }
    h3 {
        font-size: 24px;
        margin: 10px 0 0 0;
    }
    section > h3 {
        font-size: 1.1rem;
    }

    /* セクションタイトル */
    #section-top {
        height: 140px;
        width: 100%;
        text-align: center;
        border-bottom: 1px solid #ddd;
        /*padding:0 1rem;*/
    }

    #section-top-title {
        /*background-color: #8B5E3C;*/
        color: #444444;
        /*height: 296px;*/
        /*border-radius: 0 248px 248px 0;*/
        position: relative;
        letter-spacing: 0.2em;
        text-align: center;
    }
    #section-top-title > h1 {
        font-size: 1.3rem;
        display: block;
        margin: 1.5rem auto 1.5rem;
    }

    #section-top-title > span {
        font-size: 1.1rem;
        letter-spacing: 0.2em;
    }
    /* お問い合わせ */
    #contact-form {
        /*display: flex;
        justify-content: center; */
        text-align:center;
        /*max-width: 440px;*/
        margin: 0 auto;
        /*padding: 0 10px;*/
        max-width: 100%;
        padding: 0 20px;
    }
    #contact-form p {
        text-align:left;        
    }
    #submit_area p {
        text-align:center;
        line-height: 2.4rem;   
    }        
    span.wpcf7-spinner {
        display: none;
    }    
    input[type="submit"].contact_submit_btn {
        background-color: #fff;
        border: solid 2px #4E342E;
        color: #4E342E;
        padding: 10px 30px;
        text-decoration: none;
        font-size: 1em;
    }
    input[type="submit"].contact_submit_btn :hover {
        color: #4E342E;
        background-color: #b0e0e6;
    }    
    input[type="text"],input[type="email"] {
        font-size:1.0rem;
        /*padding-left:0.6rem;*/
        margin:3px 0;
        display:inline-block;
        height:2rem;
    }
    input[type="email"] {
        ime-mode: disabled;
    }
    input.wpcf7-text {
        display:inline-block;
        height:2rem;
    }
    
    textarea {
        font-size:1.0rem;
        /*padding-left: 0.6rem;*/ 
        line-height: 1.5rem;
        margin:3px 0;
    }
    .required::after {
        content: "必須";
        color: #ffffff;
        background: #cc0000;
        font-size: 0.7rem;
        padding: 2px 5px;
        border-radius: 0.5rem;
        margin-left:0.3rem;
    }
    #contact_exp {
        margin-bottom:2rem;
    }
    #contact_exp > p {
        display:block;
        text-align:center;
    }
    /* コンタクトフォーム横幅調節 */
    .wpcf7 input[name="your-company"] { /* 企業名入力欄 */
        width: 100%;
    }    
    .wpcf7 input[name="your-name"] { /* 名前入力欄 */
        width: 100%;
    }
    .wpcf7 input[name="your-email"] { /* メール入力欄 */
        width: 100%;
    }
    .wpcf7 textarea[name="your-message"] { /* 本文入力欄 */
        width: 100%;
    }

}
