@media screen and (max-width: 767.999px) {
  * {
      margin: 0;
      padding: 0;
  }
  .pc {
      display: none;
  }
  html {
  }
  body {
      color: #555555;
      font-size: 10px;
      font-family: Osaka,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
      line-height: 1.6;
      text-align: center;
      -webkit-text-size-adjust: 100%;
  }
  * html body {
      font-size: 62.5%;
      line-height: 1.6;
  }
  *:first-child+html body {
      font-size: 62.5%;
      line-height: 1.6;
  }
  p {
      font-size: 1.4em;
      text-align: justify;
      padding-bottom: 1.4em;
  }
  dt {
      font-size: 1.4em;
  }
  dd {
      font-size: 1.4em;
  }
  strong, th {
      font-weight: bold;
  }
  ul, ol {
      padding-bottom: 1.4em;
  }
  li {
      font-size: 1.4em;
  }
  li li {
      font-size: 1em;
  }
  td p, td li, td dt, td dd, dd li, dd p, li p {
      font-size: 1em;
  }
  table {
      font-size: 100%;
      line-height: 1.6;
      border-top: 1px solid #cccccc;
      border-left: 1px solid #cccccc;
      border-right-style: none;
      border-bottom-style: none;
  }
  td, th {
      font-size: 1.4em;
      text-align: left;
      vertical-align: top;
      padding: 9px;
      border-right: 1px solid #cccccc;
      border-bottom: 1px solid #cccccc;
      border-top-style: none;
      border-left-style: none;
      outline-style: none;
  }
  hr {
      text-align:        left;
      vertical-align:    top;
      height: 1px;
      border-top-style:  none;
      border-bottom:     1px solid #cccccc;
      border-right-style: none;
      border-left-style: none;
      outline-style:     none;
  }
  a:link {
      color: #0e71cf;
  }
  a:visited {
      color: #6492de;
  }
  a:hover {
      text-decoration:none;
  }
  a:active {
  }
  img {
      border-style: none;
      border-width: 0;
      max-width: 100%;
  }
  .pc {
      display: none !important;
  }
  
  .pc-switcher {
      display: none;
  }
  /******************************************************/
  /* base  */
  /******************************************************/
  #top {
      width: 100%;
  }
  .inbox {
      text-align: left;
  }
  .totop {
      text-align: right;
      float: none;
      clear: both;
      padding: 0;
  }
  .totop a  {
      background: url(/wp/wp-content/themes/treha/images/btn_page_top.png) no-repeat;
      background-size: 76px 37px;
      display: inline-block;
      height: 37px;
      width: 76px;
      text-indent: 100%; 
      white-space: nowrap; 
      overflow: hidden; 
  }
  
  
  /******************************************************/
  /* header  */
  /******************************************************/
  #header {
      background: url(/wp/wp-content/themes/treha/images/header_bg.png) repeat-x center top;
      background-size: 33px 12px;
      width: 100%;
  }
  #header .inbox {
      position: relative;
      height: 113px;
  }
  #header h1 {
      height: 28px;
      width: 155px;
      position: absolute;
      top: 21px;
      left: 5px;
  }
  #header h1 a {
  /*    background: url(/wp/wp-content/themes/treha/images/logo.png) no-repeat;
      background-size: 130px 17px;*/
      display: block;
      /*text-indent: -9999px;*/
      height: 28px;
      width: 155px;
  }
  #header p.contact {
      position: absolute;
      top: 0;
      right: 88px;
  }
  #header p.contact a {
      background: url(/wp/wp-content/themes/treha/images/header_tab_contact.png) no-repeat;
      background-size: 65px 37px;
      width: 65px;
      height: 37px;
      display: block;
      text-indent: 100%; 
      white-space: nowrap; 
      overflow: hidden;
  }
  #header p.company {
      position: absolute;
      top: 0;
      right: 8px;
  }
  #header p.company a {
      background: url(/wp/wp-content/themes/treha/images/smp/header_tab_company.png) no-repeat;
      background-size: 80px 37px;
      width: 80px;
      height: 37px;
      display: block;
      text-indent: 100%; 
      white-space: nowrap; 
      overflow: hidden;
  }
  #header #gn {
      position: absolute;
      left: 0;
      top: 60px;
      height: 53px;
      width: 100%;
  }
  #header #gn ul {
      background-image: url(/wp/wp-content/themes/treha/images/smp/header_navi_bg.png);
      background-size: 10px 53px;
      height: 53px;
      width: 100%;
      padding: 0;
  }
  #header #gn li {
      display: block;
      float: left;
      height: 50px;
      width: 25%;
      text-align: center;
  }
  #header #gn li a {
      display: flex;
      /* float: left; */
      height: 50px;
      width: 100%;
      align-items: center;
      justify-content: center;
      text-align: center;
      background: url(/wp/wp-content/themes/treha/images/smp/header_navi_line.png) no-repeat right top;
      background-size: 2px 50px;
  }
  #header #gn4 a {
      background: none;
  }
  
  
  /******************************************************/
  /* パンくず  */
  /******************************************************/
  #breadcrumb {
      background: url(/wp/wp-content/themes/treha/images/breadcrumb.png);
      background: #f8f8f8;
      padding: 6px 10px;
      margin-bottom: 20px;
      color: #755e4b;
      line-height: 1.2;
      text-align: left;
  }
  #breadcrumb ul {
      padding: 0;
      width: 100%;
      display: block;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
  }
  #breadcrumb ul li {
      font-size: 1.2em;
      display: inline;
  }
  #breadcrumb ul li a {
      color: #755e4b;
  }
  
  
  /******************************************************/
  /* フッター上カテゴリ */
  /******************************************************/
  #f_recipe_navi {
      border-top: 4px solid #e5e5e5;
      background: #f8f8f8;
      clear: both;
      padding: 20px 10px;
      margin: 0 0 0;
  }
  #f_recipe_navi .navi_tab {
      height: 35px;
      width: 100%;
      padding: 0;
  }
  #f_recipe_navi .navi_tab li {
      display: block;
      float: left;
      height: 35px;
      width: 49.4%;
      margin-right: 0.8%;
      text-align: center;
      background: #e4e1ad;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
  }
  #f_recipe_navi .navi_tab li:last-child {
      float: right;
      width: 49.4%;
      margin-right: 0;
      background: #b8dddd;
  }
  #f_recipe_navi .navi_tab li.active {
      background: #f1eebb;
  }
  #f_recipe_navi .navi_tab li.active:last-child {
      background: #c5f0f0;
  }
  #f_recipe_navi table.navi_table {
      background: #fcfcf3;
      border: 3px solid #f1eebb;
      width: 100%;
  }
  #f_recipe_navi table.navi_table:last-child {
      background: #faffff;
      border: 3px solid #c5f0f0;
  }
  #f_recipe_navi table.navi_table td {
      padding: 0;
      border: 1px solid #c1b2a6;
      width: 33%;
      line-height: 1.4;
  }
  #f_recipe_navi table.navi_table:last-child td {
      border: 1px solid #a6cdcd;
  }
  #f_recipe_navi table.navi_table a {
      background: url(/wp/wp-content/themes/treha/images/smp/brown_arrowR2.png) no-repeat right 4px center;
      background-size: 7px 11px;
      display: block;
      padding: 12px 10px;
      color: #524337;
      text-decoration: none;
  }
  #f_recipe_navi {
  }
  #f_recipe_navi .none {
      display: none;
  }
  
  /******************************************************/
  /* footer */
  /******************************************************/
  #footer {
      background: #e7f8f8;
      width:100%;
      border-top: 4px solid #aae1e1;
      clear: both;
  }
  #footer .inbox {
      margin: 0 auto;
  }
  #footer table {
      width: 100%;
      border-top: none;
      border-color: #c8d7d7;
  }
  #footer td {
      width: 50%;
      border-color: #c8d7d7;
      padding: 0;
      vertical-align: middle;
  }
  #footer td a {
      background: url(/wp/wp-content/themes/treha/images/brown_arrowR2.png) no-repeat right 10px center;
      background-size: 7px 11px;
      display: block;
      padding: 10px;
  }
  #footer .pc_switch {
      text-align: center;
      padding: 12px 0;
  }
  #footer_under .footer_inbox > ul {
    display: flex;
    background: #e7f8f8;
    flex-wrap: wrap;
  }
  #footer_under .footer_inbox > ul > li {
    width: 50%;
    box-sizing: border-box;
    border-bottom: 1px solid #c8d7d7;
    display: flex;
  }
  #footer_under .footer_inbox > ul > li:nth-of-type(2n) {
    border-left: 1px solid #c8d7d7;
  }
  #footer_under .footer_inbox > ul > li a {
    display: flex;
    width: 100%;
    align-items: center;
    padding: 10px;
    background: url(/wp/wp-content/themes/treha/images/smp/brown_arrowR2.png) no-repeat right 10px center;
    background-size: 7px 11px;
  }
  .copyright {
      clear: both;
      text-align: center;
      padding: 10px 0;
      color: #7c6c5d;
      font-size: 90%;
      letter-spacing: 0.5px;
  }
  
}