@charset "UTF-8";


/* ▼668px以上の場合に適用
--------------------------------------------------------------------- */
@media only screen and (min-width: 668px) {


   #nav-wrap {
      display: none;
   }


}

/* ▼668px以下の場合に適用(iPhone 6 landscape以下)
---------------------------------------------------------------------- */
@media only screen and (max-width: 668px) {

   body {
      font-size: 14px;
   }

   .row {
      width: 90%;
      max-width: 960px;
      margin: 0 auto;
   }

   /* nav-wrap */
   #nav-wrap {
      font: 12px;
      letter-spacing: 1.5px;
      width: auto;
      position: fixed;
      top: 0;
      right: 0;
      padding-bottom: 24px;
   }
   #nav-wrap > a {
      width: 48px;
      height: 48px;
      text-align: left;
      background-color: #E70012;
      position: relative;
      border: none;
      float: right;
      font: 0/0 a;
      text-shadow: none;
      color: transparent;
      position: relative;
      top: 10px;
      right: 10px;
   }

   #nav-wrap > a:before,
   #nav-wrap > a:after {
      position: absolute;
      border: 2px solid #fff;
      top: 35%;
      left: 25%;
      right: 25%;
      content: '';
   }
   #nav-wrap > a:after { top: 60%; }

   /* toggle buttons */
	#nav-wrap:not( :target ) > a:first-of-type,
	#nav-wrap:target > a:last-of-type  {
	   display: block;
	}

   /* hide menu panel */
   #nav-wrap ul#nav {
      height: auto;
      display: none;
      clear: both;
      width: auto;
      float: right;
      position: relative;
      top: 20px;
      right: 0;
   }

   /* display menu panels */
   #nav-wrap:target > ul#nav	{
      width: 100%;
      display: block;
      padding: 10px 20px 34px 20px;
      background: #1f2024;
      clear: both;
   }

   ul#nav li {
      display: block;
      height: auto;
      margin: 0 auto;
      padding: 0 4%;
      text-align: left;
      border-bottom: 1px solid #CCC;
      border-bottom-style: dotted; 
   }
  
   ul#nav li a {
      display: block;
      margin: 0;
      padding: 0;
      margin: 12px 0;
      line-height: 16px; /* reset line-height from 48px */
      border: none;
      color: #FFF;
   }

   /*---ヘッダー（Flexbox指定）---*/
   .header-column {
      flex-direction: column;
      padding: 15px 0;
   }

   .header-column .logo {
      width: 80%;
      margin-top: 73px;
      margin-bottom: 10px;
      display: block;
      margin-left: auto;
      margin-right: auto;
   }

   .header-column .tel {
      text-align: center;
      font-size: 14px;
   }

   .fz32 { font-size: 26px;}

   .fzLLL  { font-size: 113%;}

   .fzLLLL { font-size: 125%;}

/* !Margin ------------------------------ */
.mt10 { margin-top:10px !important;}
.mt20 { margin-top:10px !important;}
.mt30 { margin-top:15px !important;}
.mt40 { margin-top:20px !important;}
.mt50 { margin-top:25px !important;}
.mt60 { margin-top:30px !important;}
.mt70 { margin-top:35px !important;}
.mt80 { margin-top:40px !important;}
.mt100 { margin-top:50px !important;}
.mt120 { margin-top:60px !important;}
.mt160 { margin-top:80px !important;}
.mb10 { margin-bottom:10px !important;}
.mb20 { margin-bottom:10px !important;}
.mb30 { margin-bottom:15px !important;}
.mb40 { margin-bottom:20px !important;}
.mb50 { margin-bottom:25px !important;}
.mb60 { margin-bottom:30px !important;}
.mb70 { margin-bottom:35px !important;}
.mb80 { margin-bottom:40px !important;}
/* !Padding ----------------------------- */
.pt20 { padding-top:10px !important;}
.pt30 { padding-top:15px !important;}
.pt40 { padding-top:20px !important;}


}