@charset "UTF-8";
/*▽▽▽▽▽▽---------- tablet ----------▽▽▽▽▽▽*/
@media only screen and (max-width: 1100px) {
  /*--------------------- .mv ---------------------*/
  .mv::before {
    background-size: contain;
    width: 30%;
  }
  .mv::after {
    background-size: contain;
    height: 31%;
    width: 15%;
  }
  
  /*--------------------- .logo ---------------------*/
  .logo { margin: 20px 0 0 20px; width: 8%; }
  
  /*--------------------- .header ---------------------*/
  .header { bottom: -79px; width: 700px; }
  .gnav .gnav_list a { padding: 20px; }

  /*--------------------- .inr ---------------------*/
  .inr { padding: 60px 20px; width: 100%; }
  
  /*--------------------- clm ---------------------*/
  .clm_box { margin: -10px 0; }
  .clm_box .clm2, .clm_box .clm3, .clm_box .clm4 {
    float: none;
    padding: 10px 0;
    width: 100%;
  }
  .clm_box.sp_clm2 {
    margin: 0 -10px;
    overflow: hidden;
    padding: 20px 20px 0;
  }
  .clm_box.sp_clm2 .clm2, .clm_box.sp_clm2 .clm3, .clm_box.sp_clm2 .clm4 {
    float: left;
    padding: 0 5px;
    width: 50%;
  }
  
  .sp_none { display: none !important; }
}


/*▽▽▽▽▽▽---------- SP ----------▽▽▽▽▽▽*/
@media only screen and (max-width: 768px) {
  /*--------------------- .mv ---------------------*/
  .mv {
    background: url("/cmn/cmn_img/mv@2x.jpg") top center no-repeat;
    background-size: cover;
    padding-bottom: 138%;
  }
  .mv::before {
    height: 35%;
    position: absolute;
    width: 50%;
  }
  .mv::after { height: 27%; width: 40.8%; }
  .inquiry_btn { position: fixed; z-index: 15; }
  .inquiry_btn a { display: none; }
  .inquiry_btn::after {
    background-size: contain;
    height: 110px;
    width: 170px;
  }
  .mv_ttl { left: 50%; text-align: center; }
  
  /*--------------------- .logo ---------------------*/
  .logo {
    margin: 10px 0 0 10px;
    position: absolute;
    width: 14%;
  }
  
  /*--------------------- .header ---------------------*/
  .header {
    background-color: transparent;
    border: none;
    box-shadow: none;
    height: 55px;
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    transform: none;
    width: 100%;
  }
  .header_logo img { height: 45px; width: auto; }
  
  .drawer-toggle.drawer-hamburger { top: 1px!important; }
  
  /*--------------------- hambur ---------------------*/
  .gnav { display: none; }
  .gnav li { display: none; }
  .hambur { display: block; }
  .drawer-hamburger { padding: 18px 1.2rem 30px !important; width: 3rem !important; }
  .drawer-toggle.drawer-hamburger { top: 0!important; }
  .drawer-open .drawer-hamburger-icon { background-color: transparent !important; }
  .drawer-hamburger-icon, .drawer-hamburger-icon::after, .drawer-hamburger-icon::before { background-color: #fff !important; }
  .drawer-open .mv::before, .drawer-open .logo { z-index: 1; }
  li.drawer_list {
    border-bottom: 1px solid #d3d3d3;
    font-size: 16px;
    position: relative;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  li.drawer_list a {
    display: block;
    padding: 15px 20px;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  li.drawer_list a::after {
    content: "\f107";
    color: #008A32;
    font-family: FontAwesome;
    font-size: 2rem;
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -17px;
  }
  li.drawer_list:hover { background-color: #008A32; }
  li.drawer_list a:hover { color: #fff; opacity: 1 !important; }
  li.drawer_list a:hover::after { color: #fff; }
  li.drawer_list.c_btn { display: block; }
  
  li.drawer_list.in a::after{ content: "\f054"; }
  li.drawer_list.blank a::after{ content: "\f08e"; }
  li.drawer_list a { display: block; }
  
  /*--------------------- .gnav ---------------------*/
  .gnav_bnr { display: none; }
  .gnav_bnr_sp { display: block; overflow: hidden; padding: 20px; }
  .bnr_list01 { float: left; width: 25%; margin-right: 15px; }
  .bnr_list02 { float: left; width: 25%; }
  
  /*--------------------- .inr ---------------------*/
  .inr { width: 100%; }
  
  
  /*--------------------- clm ---------------------*/
  .clm_box { flex-wrap: wrap; margin: 0; }
  /*--------------------- clm ---------------------*/
  .clm_box.sp_clm2 { padding: 20px 10px 0;}
  
  
  /*--------------------- ttl ---------------------*/
  .ttl01, .ttl01_white {
    font-size: 24px;
    line-height: 1.4;
    margin-bottom: 15px;
  }
  .ttl01 span, .ttl01_white span { font-size: 12px; letter-spacing: 0.1em; }
  .ttl02, .ttl02_white { font-size: 22px; }
  .ttl02 span, .ttl02_white span { font-size: 12px; margin-left: 10px; }
  .ttl03 { margin-bottom: 10px; }
  .ttl03 span { margin-bottom: 0; }
  

  /*--------------------- btn ---------------------*/
  .btn { width: 100%; }
  
  
  /*--------------------- .basic_table ---------------------*/
  .basic_table th, .basic_table td {
    display: block;
    font-size: 14px;
    margin: -1px 0;
    width: 100%;
  }
  .basic_table th { padding: 15px 0 5px; }
  .basic_table td { line-height: 1.4; padding: 0 0 15px; }
  
  
  /*--------------------- .footer ---------------------*/
  .footer { padding: 20px 10px; }
  .footer a:hover { text-decoration: underline; }
  .footer_inr { width: 100%; }
  .footer_gnav { padding-bottom: 0; }
  .footer_gnav .footer_gnav_list li {
    border-left: none;
    float: none;
    font-size: 14px;
    padding: 0 0 20px 10px;
    text-align: left;
  }
  .footer_gnav .footer_gnav_list, .footer_gnav .footer_gnav_list.list_none { width: 100%; }
  .footer_gnav .footer_gnav_list li:last-child { border-right: none; }
  .footer_logo {
    float: none;
    margin: 0 auto;
    width: 100%;
  }
  .footer_about { margin: 20px 10px; }
  .footer_about .about {
    float: none;
    font-size: 12px;
    margin: 10px 0 0 0;
  }
  .copy_txt { font-size: 10px; }
  a.tel_link { pointer-events: auto; }
  
  
  /*▽▽▽▽▽▽---------- .article ----------▽▽▽▽▽▽*/
  /*--------------------- .article_mv ---------------------*/
  .article_mv { height: 180px; margin-top: 59px; }
  
  
  
  .pc_br { display: none; }
  .sp_br { display: block; }
  
}

@media only screen and (max-width: 500px) {
  .mv_ttl {
    font-size: 30px;
  }

  }
  .gnav_bnr_sp {
    margin: -10px 0;
    padding: 20px;
  }
  .gnav_bnr_sp li {
    float: none;
    line-height: 0;
    margin: 0;
    padding: 10px 0;
    width: 100%;
  }
}