@charset "UTF-8";


.breadcrumb {
  position: relative;
  top: 0px;/*パンくずメニューの上からの位置(PCサイト)「position」とセット*/
  padding-left:0;
  margin-left:0;
}



/*画面幅800px以上の設定(PC)
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:800px){
.breadcrumb {
  position: relative;
  top: -30px;/*パンくずメニューの上からの位置(PCサイト)「position」とセット*/
  padding-left:0;
  margin-left:-200px;
}
}


/*画面幅480px以下の設定(スマホ)
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){
.breadcrumb {
  position: relative;
  top: 10px;/*パンくずメニューの上からの位置(PCサイト)「position」とセット*/
  /*padding-left:0;*/
  padding:4px 0px 4px 0px;
  margin-left:20px;
}
}

/*画面幅481から769px以下の設定(タブレット)
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:481px) and ( max-width:800px){
.breadcrumb {
  position: relative;
  top: 30px;/*パンくずメニューの上からの位置(PCサイト)「position」とセット*/
  padding-left:0;
  padding-bottom:5;
  margin-left:0;
}
}

.breadcrumb li.pan{
  position: relative;
  top: -15px;/*パンくずメニューの上からの位置(PCサイト)「position」とセット*/
  display:inline;/*横に並ぶように*/
  list-style: none;
  font-weight: bold;/*太字*/
  font-size: 12px;
}

.breadcrumb li.pan:after{/* >を表示*/
  content: ' > ';
  padding: 10 10px;
  color: #555;
}

.breadcrumb li.pan:last-child:after{
  content: '';
}

.breadcrumb li.pan a {
    text-decoration: none;
    color: #52b5ee;/*色*/
}

.breadcrumb li.pan a:hover {
    text-decoration: underline;
}

/*パンくずスマホ非表示(非表示にしたい場合は先頭の「/*」を消す
---------------------------------------------------------------------------*/
/*.breadcrumb li.pan{
	display: none;
}
