@charset "utf-8";


/* common ---------------- */
#contents { padding: 10px 0; }

.bg_check { background: url("../img/bg_check.jpg"); }
.bg_blue { background: url("../img/bg_dot_blue.jpg"); }
.bg_glay { background: #ebe7e7; }

.box_area { margin: 60px 0; }
.box_area .ttl { position: relative; z-index: 1; }
.box_con { position: relative; margin: -110px 4% 0; padding: 120px 30px; background: #fff; border-bottom-left-radius:20px; border-bottom-right-radius:20px; box-shadow: 5px 5px rgba(121, 115, 113, 0.75); }
.box_con figure { margin-bottom: 10px; }
.box_con .txt { width: 60%; }

/* title */
.pagettl img { width: 100%; }
.txtTtl { margin:1em 0; color:#5f3602; font-size:1.5em; font-weight:bold; text-align:center; }

/* contents ---------------- */

/*店舗紹介　shop*/
#shop .box_con .person { position: absolute; bottom: 0; right: 0; width: 44%; margin: 0; }
#shop #kobac .txt,
#shop #seibi .txt { width: 100%; }

/*在庫　zaiko*/
#zaiko #contents .narrow { margin: 0; padding: 0; max-width: 100%; }
#cs-stock { width: 100%!important; height: auto!important; }

/*納車式　nousya*/
#nousya #contents { padding-top: 0; }
#nousya .box_con { margin-left: 5%; margin-right: 5%; }
.nousya_list li { width: 24%; margin-bottom: 10px; }
.nousya_list .date { margin: 0; display: inline-block; padding: 0 .7em; color: #fff; background: #ff7500; border-top-left-radius:10px; border-top-right-radius:10px;  }
.nousya_list .image { margin: 0; }
.nousya_list .image img { border-top-right-radius:10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; border: 2px solid #ff7500; }
#nousya .box_area { margin-top: 0; }
.box_area.nara .nousya_list .date { background: #1ea339; }
.nara .nousya_list .image img { border-color: #1ea339; }

/*お客様アンケート　enquete*/
#enquete #contents { padding-top: 0; }
#enquete .box_area { margin-top: 0; }
#enquete .box_con { margin-left: 5%; margin-right: 5%; }
.enquete_list li { width: 24%; margin-bottom: 10px; }
.enquete_list .image { text-align: center; }
.enquete_list .image img { border: 2px solid #ff7500; }
.box_area.nara .enquete_list .image img { border-color: #1ea339; }
.enquete_list .tanto_area { margin-top: -40px; }
.enquete_list .tanto_area .staff { width: 30%; height: 100%; margin: 0; border-radius: 50%; overflow: hidden; }
.box_area.honten .enquete_list .tanto_area .staff { background: #ff7500;}
.box_area.nara .enquete_list .tanto_area .staff { background: #1ea339;}
.enquete_list .tanto_area .data { margin: 0; padding: 60px 0 0; width: 68%; color: #5f3602; }
.enquete_list .tanto_area .date { margin: 0; }
.enquete_list .tanto_area .tanto { margin: 0; padding-left: 45%; font-size: 1.8em; font-weight: bold; background: url("../img/enquete/ttl_tanto.png") no-repeat 0 0 / 40%; line-height: 1.4; }
.box_area.nara .enquete_list .tanto_area .tanto { background-image: url("../img/enquete/ttl_tanto_nara.png"); }

/*スタッフ紹介　staff*/
#staff .pagettl { position: relative; }
#staff .pagettl:after{ position: absolute; bottom: -30px; right: 20px;
    content: ""; width: 100%; height: 100%; }
#staff.honten .pagettl:after { background: url(../img/staff/go_honten.png) no-repeat 100% 100%/40%; }
#staff.nara .pagettl:after { background: url(../img/staff/go_nara.png) no-repeat 100% 100%/40%; }
#staff .ttl { margin: 0 0 1em -10px; }
#staff .staff_list { margin-bottom: 3em; align-items: flex-end; }

/*Q&A　qa*/
.qa_list li { margin-bottom: 3em; }
.qa_list .q { min-height: 50px; padding-left: 60px; color: #5f3602; background: url("../img/qa/icon_q.png") no-repeat 0 0; }
.qa_list .a { padding: 30px; color: #fff; background:#ff7500; border-radius: 10px; box-shadow: 5px 5px #fff100; }
#qa .tanto { float: right; width: 17%; color: #5f3602; font-weight: bold; }
#qa .tanto .part { margin: 0; font-size: 1.2em; }
#qa .tanto .name { margin: 0; font-size: 1.5em; }
#qa .tanto .staff { width: 75px; }
#qa .tanto .staff img { border-radius: 50%; border: 2px solid #ff7500; box-shadow: 3px 3px #fff100; }

/*アクセス　access*/
#access .box_area { margin: 10px 0; padding: 20px 10px 600px; color: #fff; text-align: center; border-radius: 10px; }
#access .box_area.honten { background:url("../img/access/img_honten.jpg") no-repeat #ff7500 0 100% / 100%; }
#access .box_area.nara { background:url("../img/access/img_nara.jpg") no-repeat #1ea339 0 100% / 100%; }
#access .gmap { width: 100%; height: 450px; border-radius: 10px; box-shadow: 5px 5px 5px rgba(62, 59, 58, 0.75); }
#access .sub_ttl { width: 90%; margin: 0 auto; font-size: 1.2em; color: #fff; text-align: center; border-radius: 30px; background: #5f3602; box-shadow: 3px 3px #fff100; }
#access .sub_ttl span,
#access .txt span { color:#fff100; }
#access ol { text-align: left; }
#access .contact_box { padding: 20px 10px 0px; color: #5f3602; background: #fff; box-shadow: 3px 3px #fff100; }
#access .contact_box .tel { margin: 0; font-size: 3em; font-weight: bold; }
#access .shop_data .name { font-size: 1.2em; }
#access .shop_data .data { font-size: .9em; }

/*会社概要　company*/
#company #contents { padding: 10px 0 0; }
.profile { position: relative; padding: 10px 0 100px; }
.profile .tbl { box-shadow: 5px 5px rgba(121, 115, 113, 0.75); }
.profile .business li { width: 25%; }
.profile .message { padding-bottom: 120px; margin: 20px 10px 240px; font-size: .85em; border: 2px solid #ee9300; }
.profile .message .ttl { margin-top: 0; color: #fff; background: #ee9300; }
.profile .message .txt { margin: 10px; }
.president { position: absolute; bottom: -100px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

.history { padding: 100px 0 0; background: #ff7500; }
.history_con { background: #fff; }
.history_con .ttl { text-align: center; color: #fff; background:#8abe1f; }
.history_list li { padding: 10px; }
.history_list li .year { position: relative; padding-left: 1.2em; color: #8abe1f; font-size: 1.1em; font-weight: bold; }
.history_list li .year:before { position: absolute; top: 50%; left: 0;
    content: ""; width: 0; height: 0; 
    border-style: solid; border-width: 8px 5.5px 0 5.5px;
    border-color: #8abe1f transparent transparent transparent; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.history_list li:nth-child(even) { color: #fff; background:#8abe1f; }
.history_list li:nth-child(even) .year { color: #fff; }
.history_list li:nth-child(even) .year:before { border-color: #fff transparent transparent transparent; }
.history_list dt,
.history_list dd { margin-bottom: .7em; }
.history_list dt { float: left; width: 6em;}
.history_list dd { padding-left: 6em; margin-top: .7em; }

/*お問い合わせフォーム contact*/
#contact .box { margin: 50px 0; padding: 50px; background: #fff; }
.c-form { border: 1px solid #bbb; }
.c-form > div { display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.c-form dt, .c-form dd { padding:10px; }
.c-form dt { width:20%; color:#fff; background:#ee9300; }
.c-form dd { -webkit-box-flex:1; flex:1; background:#fff; }

.submit { margin:2em 0; }
.submit input {
  padding:1em 2em; color:#5f3602; font-size:1.5em; font-weight:bold; background:#fff100;
}

/*404error*/
#error .ttl { margin: 1em 0; text-align: center; font-size: 1.5em; border-bottom: 1px solid #ff7500; }

/* ================================================================
  レスポンシブ
=================================================================== */
/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {
    /*会社概要　company*/
    .profile .business { width: 50%; margin: 0 auto; }
    img.graph { width: 50%; }
    .president img { width: 80%; }

    .c-form dt, .c-form dd { border-bottom:1px solid #e8e8e8; }

}

/* 960px以上(PC) */
@media screen and (min-width: 960px) {

}


/* ================================================================
  タブレット
=================================================================== */
/* 1024以下 (タブレット横以下) */
@media screen and (max-width: 1024px) {
    .box_con { margin: -80px 4% 0; padding: 70px 30px; }
    /*店舗紹介　shop*/

}

/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {
    .box_con { margin: -30px 4% 0; padding: 20px 30px; 
        border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
 
    /*お客様アンケート　enquete*/
    .enquete_list .tanto_area { margin-top: 0; }
    .enquete_list .tanto_area .data { width: 100%; padding: 0; }
    .enquete_list .tanto_area .staff { width: 50%; }
    .enquete_list .tanto_area .tanto { font-size: 1.2em; }
    
    /*Q&A　qa*/
    #qa .tanto { width: 25%; }
    
    /*アクセス　access*/
    #access .box_area { padding-bottom: 390px; }
    
    /*会社概要　company*/
    .profile .message { margin: 20px 10px 250px; }


}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){
    .box_area { margin: 15px 0; }
    .box_con { margin: -20px 4% 0; padding: 20px 10px; box-shadow: 3px 3px rgba(121, 115, 113, 0.75);  }
    
     /*納車式　nousya*/
    .nousya_list li,
    .enquete_list li{ width: 49%; }
        
     /*お客様アンケート　enquete*/
    .enquete_list .tanto_area { margin-top: -20px; }
    
    /*スタッフ紹介　staff*/
    #staff .staff_list li { width: 100%; }
    
    /*Q&A　qa*/
    .qa_list .q { padding-left: 13%; background-size: 10%; }
    .qa_list .a { padding: 10px; }
    #qa .tanto { width: 50%; }

    /*アクセス　access*/
    #access .box_area { padding-bottom: 200px; }
    #access .gmap { height: 320px; }
    
    /*会社概要　company*/
    .profile .message .txt { text-align: left; }
    .profile .message { margin: 20px 10px 80px; padding-bottom: 80px; }
    .president { bottom: -10px; }
    .history { margin-top: -60px; padding: 70px 0 0; }

    /*お問い合わせフォーム contact*/
    #contact .box { margin: 10px 0; padding: 10px; }
    .c-form dt { width:100%; }
    .c-form dd { width:100%; }

}

/*スマホSE以下*/
@media screen and (max-width: 320px){
    #access .contact_box .tel { font-size: 2em;  }
}