@charset "UTF-8";


/*ーーーーーーーーーー
.header
ーーーーーーーーーーー*/
/*  ----  .header+nav-toggle etc  ----  */

#head_wrap {
 top: 0;
 position: relative;
 width: 100%;
 margin: 0px auto 0;
 line-height: 1;
 z-index: 999;
 height: 0px;
 text-decoration: none;
}

#head_wrap a {
 display: block;
 text-decoration: none;
}

#head_wrap .inner {
 width: 100%;
 margin: 0 auto;
 position: relative;
}

#head_wrap .inner:after {
 content: "";
 clear: both;
 display: block;
}

#head_wrap .logo {
 display: block;
 width: 120px;
 margin: 0;
 text-indent: -1000px;
}

#head_wrap .logo_img {
 display: block;
 width: 140px;
 margin: 0;
 height: 100%;
}

#head_wrap .logo_img_fixed {
 display: none;
}



#global-nav {
 position: relative;
 display: flex;
 justify-content: space-between;
 width: 100%;
 align-items: center;
 background: rgb(255 255 255 / 0%);
 margin: 0 auto;
 padding: 20px 0 0 1.5vw;
}

#global-nav ul {
 padding: 0 1.5vw 0 0;
/*
 list-style: none;
 font-size: 14px;
 display: flex;
 justify-content: space-between;
 width: 70%;
*/
}

/*
#global-nav ul.list li a {
 position: relative;
 display: inline-block;
 text-decoration: none;
 font-size: 14px;
 font-weight: 500;
 color: #333333;
}

#global-nav ul.list li a:hover {
 color: #ff914c;
}

#global-nav ul.list li a::after {
 position: absolute;
 bottom: -14px;
 left: 0;
 content: '';
 width: 100%;
 height: 4px;
 background: #ff914c;
 transform: scale(0, 1);
 transform-origin: left top;
 transition: transform .3s;
}

#global-nav ul.list li a:hover::after {
 transform: scale(1, 1);
}

#global-nav ul.list li.gray {
 color: #969696;
}

#global-nav ul.header-logo_fixed {
 display: block;
 width: 170px;
 height: 100%;
 padding: 0 0 0 1.5vw;
 box-sizing: border-box;
}
*/


/* Fixed */
#head_wrap.fixed {
 position: fixed;
 top: 0;
 margin-top: 0;
 height: 76px;
 transition: top 0.65s ease-in;
 -webkit-transition: top 0.65s ease-in;
 -moz-transition: top 0.65s ease-in;
 z-index: 9999;
}

#head_wrap.fixed .inner {
 background: rgba(255, 255, 255, 0);
 padding: 0;
}

#head_wrap.fixed #global-nav {
 justify-content: space-between;
}


#head_wrap.fixed .logo {
 display: none;
}


#head_wrap.fixed #global-nav ul.header-logo_fixed {
 display: block;
}

#head_wrap.fixed #global-nav ul.header-logo_fixed li {
 width: 100%;
 height: 100%;
}

#head_wrap.fixed #global-nav ul.header-logo_fixed li .logo_img {
 display: none;
}

#head_wrap.fixed #global-nav ul.header-logo_fixed li .logo_img_fixed {
 display: block;
 width: 140px;
 margin: 0;
 height: 100%;
}

#mobile-head {
 display: none;
}


@media (max-width: 812px) {
#head_wrap.fixed #global-nav ul.header-logo_fixed {
 display: none;
}
}


/* Toggle Button */
#nav-toggle {
 display: none;
 position: absolute;
 right: 12px;
 top: 14px;
 width: 34px;
 height: 36px;
 cursor: pointer;
 z-index: 101;
}

#nav-toggle div {
 position: relative;
}

@media (max-width: 812px) {
 #head_wrap {
  top: 0;
  position: fixed;
  margin-top: 0;
  width: 100%;
  padding: 0;
  /* Fixed reset */
 }
 #head_wrap .inner {
  width: 100%;
  padding: 0;
 }

 #head_wrap.fixed .inner {
  background: none;
  padding: 0;
 }

 #head_wrap .fixed {
  padding-top: 0;
  background: transparent;
 }
 #mobile-head {
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 1);
  width: 100%;
  height: 50px;
  z-index: 999;
  position: relative;
 }

 #head_wrap.fixed .logo {
  display: block;
 }

 #head_wrap.fixed .logo,
 #head_wrap .logo {
  position: relative;
/*
  left: 13px;
  top: 13px;
*/
  display: block;
  margin: 0 auto;
  text-indent: 0;
 }

 #head_wrap.fixed .logo a,
 #head_wrap .logo {
  text-decoration: none;
  transition: all .3s;
 }

 #global-nav {
  display: none;
/*
  position: absolute;
   開いてないときは画面外に配置 
  top: -520px;
  width: 100%;
  flex-direction: column;
  background: rgba(255, 255, 255, 1);
  box-sizing: border-box;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  padding: 0 0 30px 0;
  text-align: center;
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  margin: 0 auto;
*/
 }
 #global-nav ul {
  display: block;
  list-style: none;
  position: static;
  right: 0;
  bottom: 0;
  font-size: 16px;
  margin: 20px 0 0 0;
 }

 #global-nav ul li {
  float: none;
  position: static;
  margin: 0 0 20px 0;
 }
 #head_wrap #global-nav ul li a,
 #head_wrap.fixed #global-nav ul li a {
  width: 200px;
/*  display: block;*/
  padding: 0 0 20px 0;
  margin: 0 auto;
  background: none;
 }
 
 #global-nav ul.list li a::after {
  bottom: 0;
 }

 #nav-toggle {
  display: block;
 }
 /* #nav-toggle 切り替えアニメーション */
 #nav-toggle span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #666;
  left: 0;
  -webkit-transition: .35s ease-in-out;
  -moz-transition: .35s ease-in-out;
  transition: .35s ease-in-out;
 }
 #nav-toggle span:nth-child(1) {
  top: 1px;
 }
 #nav-toggle span:nth-child(2) {
  top: 11px;
 }
 #nav-toggle span:nth-child(3) {
  top: 22px;
 }
 .open #nav-toggle span:nth-child(1) {
  top: 11px;
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg);
 }
 .open #nav-toggle span:nth-child(2) {
  width: 0;
  left: 50%;
 }
 .open #nav-toggle span:nth-child(3) {
  top: 11px;
  -webkit-transform: rotate(-315deg);
  -moz-transform: rotate(-315deg);
  transform: rotate(-315deg);
 }
 /* #global-nav スライドアニメーション */
/*
 .open #global-nav {
   #global-nav top + #mobile-head height 
  -moz-transform: translateY(556px);
  -webkit-transform: translateY(556px);
  transform: translateY(556px);
 }
*/
}
/*  ----  // .header+nav-toggle etc ここまで  ----  */


/*  ----  パンクズリスト　ここから  ----  */
#head_wrap #breadcrumbs {
 display: block;
 width: 100%;
 height: 30px;
 background-color: #edfaff;
}

#head_wrap #breadcrumbs ul {
 width: 980px;
 height: 100%;
 margin-right: auto;
 margin-left: auto;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
}

#head_wrap #breadcrumbs ul li a, #head_wrap #breadcrumbs ul li span {
 height: 100%;
 position: relative;
 text-decoration: none;
 font-size: 12px;
 color: #00a4e5;
 padding-right: 24px;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
}

#head_wrap #breadcrumbs ul li a::after, #head_wrap #breadcrumbs ul li span::after {
 content: "";
 background-image: url(../images/ico-breadcrumbs.png);
 background-size: 12.5px 30px;
 background-repeat: no-repeat;
 background-position: center top;
 width: 12.5px;
 height: 30px;
 display: block;
 position: relative;
 position: absolute;
 top: 0;
 right: 0;
}

#head_wrap #breadcrumbs ul li:nth-child(n+2) {
 padding-left: 15px;
}

@media (max-width: 812px) {
 #head_wrap #breadcrumbs {
  display: none;
}
}

/*  ----  //  パンクズリスト　ここまで  ----  */
s
/*------------------------------------------
//　header + main visual
------------------------------------------*/





