@charset "UTF-8";


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


   #Sp_Cover {
      display: none;
   }

   .Sp_Btn_Inquiry a {
      display: none;
   }


}


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


   header {
      display: none;
   }

   #Top_Navi_Wrap {
      display: none;
   }

   #Navi_Wrap {
      display: none;
   }

   #Slide_Topics {
      display: none;
   }

   #Sp_Cover {
      width: 100%;
      margin-top: 68px;
   }

   /* 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: #5FCBBC;
      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;
   }

   h1 {
      font-size: 20px;
   }

   h2 {
      font-size: 18px;
      color: #22ac38;
      border-bottom: 1px solid #8fc31f;
   }

   .Btn_Inquiry a {
      display: none;
   }

   .row02 {
      width: 80%;
      margin: 0 auto;
   }

   .fz36 { font-size: 20px; line-height:1.4em;}

   .Copy {
      height:30px;
      font-size: 9px;
      text-align: center;
   }


}


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





}


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


   body {
      font-family:"メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
      -webkit-text-size-adjust: none;
      font-size: 75%;
      color: #111;
   }


/* !Margin ------------------------------------------------------------------ */
.mt10 { margin-top:10px !important;}
.mt20 { margin-top:10px !important;}
.mt30 { margin-top:10px !important;}
.mt40 { margin-top:10px !important;}
.mt50 { margin-top:10px !important;}
.mt60 { margin-top:10px !important;}
.mt70 { margin-top:10px !important;}
.mt80 { margin-top:10px !important;}
.mt100 { margin-top:20px !important;}
.mb10 { margin-bottom:10px !important;}
.mb20 { margin-bottom:10px !important;}
.mb30 { margin-bottom:10px !important;}
.mb40 { margin-bottom:10px !important;}
.mb50 { margin-bottom:10px !important;}
.mb60 { margin-bottom:10px !important;}
.mb70 { margin-bottom:10px !important;}
.mb80 { margin-bottom:10px !important;}
.mb100 { margin-bottom:10px !important;}


}