@charset "utf-8";

/*-------------------------------------------------------------------------
 画面下追随ナビゲーション
 /internet 配下用
--------------------------------------------------------------------------*/

/* general.css より初期設定コピー */
ol,ul{
  margin:0;
  padding:0;
}


/* /electricity 配下の追随ナビゲーションを踏襲
　　共通画像は /electricity から /internet 配下にコピー */
#fixdNavigation {
  opacity: 0;
  display:none; /* 追加2017/4/11 */
}
#fixdNavigation a:hover {
  opacity: 1;
}

@media screen and (min-width: 768px) {
  #fixdNavigation {
    width: 100%;
    min-width: 980px;
    height: 110px;
    background: url(/content/dam/au-com/internet/navi/navi_bg_01.png) repeat-x 0 40px;
    position: fixed;
    /* left: 0; */
    left: 90px; /* 2017.01.05 表示不具合修正 */
    bottom: 0;
    /* z-index: 999999; */
    z-index: 8; /* 2017.01.05 表示不具合修正 */
    transition-duration:.3s;
    -webkit-transition-duration:.3s;
    -moz-transition-duration:.3s;
  }
  #fixdNavigation.on {
    bottom: -75px;
    transition-duration:.3s;
    -webkit-transition-duration:.3s;
    -moz-transition-duration:.3s;
  }
  #fixdNavigation .navigationContent {
    width: 980px;
    margin: 0 auto;
    padding-top: 40px;
    position: relative;
  }
  #fixdNavigation .navigationContent #triggerBtn {
    position: absolute;
    top: 0;
    right: 0;
  }
  #fixdNavigation .navigationContent #triggerBtn a {
    display: block;
    width: 230px;
    height: 40px;
    display: none;
    text-indent: -9999em;
    overflow: hidden;
  }
  #fixdNavigation .navigationContent #triggerBtn a.open {
    display: block;
    background: url(/content/dam/au-com/internet/navi/navi_btn_open_01.png) no-repeat 0 0;    
  }
  #fixdNavigation .navigationContent #triggerBtn a.close {
    display: none;
    background: url(/content/dam/au-com/internet/navi/navi_btn_close_01.png) no-repeat 0 0;
  }
  #fixdNavigation.on .navigationContent #triggerBtn a.open {
    display: none;
  }
  #fixdNavigation.on .navigationContent #triggerBtn a.close {
    display: block;
  }
  #fixdNavigation .navigationContent .coverBtnArea {
    display: table;
    position: absolute;
    top: 0;
    left: 0;
  }
  #fixdNavigation .navigationContent .coverBtnArea li {
    display: table-cell;
    vertical-align: bottom;
  }
  #fixdNavigation .navigationContent .coverBtnArea form {
    line-height: 0;
  }
  #fixdNavigation .navigationContent .coverBtnArea li img { margin-right: 10px;}
  #fixdNavigation .navigationContent .coverBtnArea li input { margin-right: 10px;}
  #fixdNavigation .navigationContent .coverBtnArea li img.pcBtn { display: inline; }
  #fixdNavigation .navigationContent .coverBtnArea li img.spBtn { display: none; }
  #fixdNavigation .navigationContent .coverBtnArea li input.pcBtn { display: inline; }
  #fixdNavigation .navigationContent .coverBtnArea li input[type="image"].spBtn { display: none; }

  #fixdNavigation .navigationContent .innerWrap {
    height: 70px;
    display: table;
    float: right;
  }
  #fixdNavigation .navigationContent .innerWrap .inqueryTxt,
  #fixdNavigation .navigationContent .innerWrap .tel {
    display: table-cell;
    vertical-align: middle;
  }
  #fixdNavigation .navigationContent .innerWrap p {
    color: #fff;
  }
  #fixdNavigation .navigationContent .innerWrap .tel {
    padding: 0 0 0 8px;
  }
  #fixdNavigation .navigationContent .innerWrap .inqueryTxt,
  #fixdNavigation .navigationContent .innerWrap .tel {
    display: table-cell;
    vertical-align: middle;
  }
  #fixdNavigation .navigationContent .innerWrap .inqueryTxt{
    font-size:12px;
  }
  #fixdNavigation .navigationContent .innerWrap .tel span {
    padding: 6px 8px;
    display: inline-block;
    border: 1px solid #fff;
    font-size: 18px;
    color: #fff;
  }
  #fixdNavigation .navigationContent .innerWrap .tel a {
    color: #fff;
  }
}

@media screen and (max-width:1199px) {
  #fixdNavigation {
    left: 0;
  }
  #fixdNavigation .navigationContent .coverBtnArea input[type="image"]  {border-radius: 0 !important;}
}

@media screen and (min-width: 768px) and (max-width: 979px) {
  #fixdNavigation {
    min-width: 768px;
    left: 0;
    z-index: 999999;
  }
  #fixdNavigation .navigationContent {
    width: 100%;
  }
  #fixdNavigation .navigationContent #triggerBtn {
    top: 5px;
  }
  #fixdNavigation .navigationContent #triggerBtn a.open {
    height: 37px;
    background: url(/content/dam/au-com/internet/navi/navi_btn_open_01.png) no-repeat right center;
    background-size: 83% auto;
  }
  #fixdNavigation .navigationContent #triggerBtn a.close {
    height: 37px;
    background: url(/content/dam/au-com/internet/navi/navi_btn_close_01.png) no-repeat right center;
    background-size: 83% auto;
  }
  #fixdNavigation .navigationContent .coverBtnArea {
    top: 6px;
  }
  #fixdNavigation .navigationContent .coverBtnArea li img.pcBtn {
    display: inline;
    width: auto;
    height:34px;
    vertical-align: middle;
    margin-right: 10px;
  }
  #fixdNavigation .navigationContent .coverBtnArea li input[type="image"].pcBtn {
    display: inline;
    width: auto;
    height:34px;
    vertical-align: bottom;
    margin-right: 10px;
  }
  #fixdNavigation .navigationContent .coverBtnArea form {
    line-height: 0;
  }
  #fixdNavigation .navigationContent .coverBtnArea input[type="image"]  {border-radius: 0 !important;}
}

@media screen and (min-width: 0px) and (max-width: 767px) {
  #fixdNavigation {
    width: 100%;
    min-width: 320px;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 999999;
    transition-duration:.3s;
    -webkit-transition-duration:.3s;
    -moz-transition-duration:.3s;
  }
  #fixdNavigation.on {
    bottom: -100%;
    transition-duration:.3s;
    -webkit-transition-duration:.3s;
    -moz-transition-duration:.3s;
  }
  #fixdNavigation .navigationContent #triggerBtn {
      margin: 0 0 0 8px;
  }
  #fixdNavigation .navigationContent #triggerBtn a {
    width: 339px;
    height: 60px;
    text-indent: -9999em;
    overflow: hidden;
  }
  #fixdNavigation .navigationContent #triggerBtn a.open {
    display: none;
    background: url(/content/dam/au-com/internet/navi/navi_btn_open_01_sp.png) no-repeat 0 1px;
    background-size: 100% auto;
  }
  #fixdNavigation .navigationContent #triggerBtn a.close {
    display: block;
    background: url(/content/dam/au-com/internet/navi/navi_btn_close_01_sp.png) no-repeat 0 1px;
    background-size: 100% auto;
  }
  #fixdNavigation.on .navigationContent #triggerBtn a.open {
    display: block;
  }
  #fixdNavigation.on .navigationContent #triggerBtn a.close {
    display: none;
  }
  #fixdNavigation .navigationContent .coverBtnArea {
    padding: 2px 0 0;
    background: rgba(0,0,0,0.8);
  }

  #fixdNavigation .navigationContent .coverBtnArea form {
    line-height: 0;
  }

  #fixdNavigation .navigationContent .coverBtnArea li img.pcBtn { display: none; }
  #fixdNavigation .navigationContent .coverBtnArea li img.spBtn { display: inline; }
  #fixdNavigation .navigationContent .coverBtnArea li input.pcBtn { display: none; }
  #fixdNavigation .navigationContent .coverBtnArea li input.spBtn { display: inline; }
  #fixdNavigation .navigationContent .coverBtnArea img { width: 100%; height: auto; }
  #fixdNavigation .navigationContent .coverBtnArea input[type="image"]  { width: 100%; height: auto; border-radius: 0 !important;}

  #fixdNavigation .navigationContent .innerWrap {
    padding: 16px 20px 18px;
    background: rgba(0,0,0,0.8);
  }
  #fixdNavigation .navigationContent .innerWrap .inqueryTxt {
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
  }
  #fixdNavigation .navigationContent .innerWrap .tel {
    margin: 20px 0 0;
    border: 1px solid #fff;
    text-align: center;
    -webkit-text-size-adjust: 100%;
  }
  #fixdNavigation .navigationContent .innerWrap p {
    color: #fff;
  }
  #fixdNavigation .navigationContent .innerWrap .tel a {
    padding: 16px 12px 14px 16px;
    display: block;
    font-size: 22px;
    color: #fff;
    text-decoration: none;
  }
}

@media screen and (min-width: 0px) and (max-width: 555px) {
  #fixdNavigation .navigationContent #triggerBtn a {
    width: 226px;
    height: 40px;
  }
  #fixdNavigation .navigationContent .innerWrap .inqueryTxt {
    font-size: 12px;
  }
  #fixdNavigation .navigationContent .innerWrap .tel a {
    padding: 10px 8px 8px 10px;
    display: block;
    font-size: 18px;
    color: #fff;
    text-decoration: none;
  }
}