@charset "UTF-8";
@import url("module.css");
/* ----------------------------------------------------------------------------
 * Style Import
 * Time-stamp: <2009-05-29T15:46:30+09:00>
 * ------------------------------------------------------------------------- */

/* Page TOP ボタン */
.GoToTop {
	position:fixed;
	bottom:10px;
	right:18px;
}

/* 写真にシャドウを付ける */
img.shadow013 {
	box-shadow:5px 5px 10px 5px #aaa;
}

/* YouTube動画 をフレキシブルにする */
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* for Now Loading */
/* 上から本来の表示要素を覆い隠す要素 */
#cover {
  width: 100%;
  height: 100%;
  position: absolute;
  background: #fff;
  top: 0px;
  left: 0px;
  z-index: 10000;
}

/* Now Loadingのアイコンなどの要素 */
#loader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 50px; /* Now Loadingのアイコンサイズに合わせる */
  height: 50px; /* Now Loadingのアイコンサイズに合わせる */
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+　パンくずリスト（MdN:現場で役立つCSS3デザインパーツライブラリ） 2018.12.11
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#breadcrumb { 
list-style: none; 
overflow: hidden;
background: #d4e2e9;
-webkit-border-radius: 0 5px 5px 0; 
-moz-border-radius: 0 5px 5px 0; 
border-radius: 0 5px 5px 0;
behavior: url(PIE.htc);
}
#breadcrumb li { 
float: left;
}
#breadcrumb li a {
color: #fff;
text-decoration: none; 
padding: 6px 0 6px 55px;
background: #135f82; 
position: relative; 
display: block;
float: left;
}
#breadcrumb li a:after { 
content: " "; 
display: block; 
width: 0; 
height: 0;
border-top: 50px solid transparent;           /* Go big on the size, and let overflow hide */
border-bottom: 50px solid transparent;
border-left: 30px solid #135f82;
position: absolute;
top: 50%;
margin-top: -50px; 
left: 100%;
z-index: 2; 
}	
#breadcrumb li a:before { 
content: " "; 
display: block; 
width: 0; 
height: 0;
border-top: 50px solid transparent;           /* Go big on the size, and let overflow hide */
border-bottom: 50px solid transparent;
border-left: 30px solid #d4e2e9;
position: absolute;
top: 50%;
margin-top: -50px; 
margin-left: 2px;
left: 100%;
z-index: 1; 
}	
#breadcrumb li:first-child a {
padding-left: 20px;
-webkit-border-radius: 5px 0 0 5px; 
-moz-border-radius: 5px 0 0 5px; 
border-radius: 5px 0 0 5px;
behavior: url(PIE.htc);
}

#breadcrumb li:nth-child(2) a       { background: #3588af; }
#breadcrumb li:nth-child(2) a:after { border-left-color: #3588af; }

#breadcrumb li:nth-child(3) a       { background: #50a2c9; }
#breadcrumb li:nth-child(3) a:after { border-left-color: #50a2c9; }

#breadcrumb li:nth-child(4) a       { background: #6fbde1; }
#breadcrumb li:nth-child(4) a:after { border-left-color: #6fbde1; }

#breadcrumb li:nth-child(5) a       { background: #91d2f0; }
#breadcrumb li:nth-child(5) a:after { border-left-color: #91d2f0; }

#breadcrumb li:last-child a {
background: transparent !important;
color: #104862;
pointer-events: none;
cursor: default;
}
#breadcrumb li:last-child a:after { border: 0; }
#breadcrumb li a:hover { background: #104862; }
#breadcrumb li a:hover:after { border-left-color: #104862 !important; }