.header_tytle a{text-decoration: none; color: white;display: block;}
.headerColor-default {
  color: #000;
  background: white;
  /* （画像よりも下までスクロールした時に変えたい文字色） */
}
.tel_img{margin-top: 0px;
margin-right: 10px;}

.header_tel{margin-top: 3px;}
.header_mail{margin-top: -10px;}
.header_tytle{width: 240px;}
.header_tytle img{width: 100%;}



.h1{position: absolute;top: 62%;left: 50%;font-size: 2vw;color: white;font-weight: bold;transform: translate(-52%, -50%);}
.h_eng{position: absolute;top: 75%;font-size: 18px;left: 50%;font-weight: bold;color: #0047B4;transform: translate(-52%, -50%);}
.pad{padding: 0px 0px;background: white;z-index: 500;text-align: center;position: fixed;top:0;}
.header_tytle{width: 210px;margin-left: 100px;}
header {height: 80px;width: 100%;color: white;display: flex;justify-content: center;padding: 20px 10px 15px 10px;}
header .headline{line-height: 100px;font-size: 30px;width: 200px;margin-top: 5px;}
header .headline img{width: 100%;}
.nav-list {line-height: 100px;margin-left: 15px;list-style: none;margin-right: 40px;position: relative;}
.nav-list a{color: #707070; text-decoration: none;}
.nav-list-item {list-style: none;display: inline-block;margin: 0 15px;text-decoration: none;}
.header_content_2{display: flex; flex-direction: column; width: 345px; margin-top: 20px;}
.image{margin-bottom: 80px; position: relative;}
.header_mail{width: 170px;}
header .header_bun{margin: 0px 0px 6px 0px;}
.rogo-sp {text-align: center;margin-bottom: -15px;}
.site-header .main-menu {list-style: outside none none;margin: 0;padding: 0;}
.site-header .main-menu li {display: inline-block;margin-right: 2rem;position: relative;}
.site-header .main-menu li a::after {
    content: "";
    border-top: 2px solid;
    width: 100%;
    position: absolute;
    display: block;
    -webkit-transform: rotateY(90deg);
    transform: rotateY(90deg);
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition: 0.25s linear;
    transition: 0.25s linear;
    -webkit-transform-origin: left 2px;
    transform-origin: left 2px;
}

.site-header .main-menu li a:hover::after {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.site-header .main-menu li a {
    color: #fff;
    display: block;
    font-weight: bold;
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
    position: relative;
    -webkit-transform-origin: left 50%;
    transform-origin: left 50%;
}

.site-header.show .main-menu li a {
    color: #111;
}

.site-header .main-menu .sub-menu {
    background-color: rgba(0, 0, 0, 0.65);
    left: -1rem;
    list-style: outside none none;
    opacity: 0;
    padding: 1rem;
    position: absolute;
    -webkit-transform: translateY(-1rem);
    transform: translateY(-1rem);
    -webkit-transition: all 0.15s ease-in-out 0s;
    transition: all 0.15s ease-in-out 0s;
    visibility: hidden;
    display: none;
}

.site-header .main-menu .sub-menu li {
    margin: 0.5rem 0;
    white-space: nowrap;
}

.site-header .main-menu .sub-menu li a {
    color: #fff;
}

.site-header .main-menu li:hover .sub-menu {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    visibility: visible;
}

.nav_toggle{display: none;}
.nav{display: none;}
.nav_matome{position: fixed; z-index: 10000;}
.toiawase{background: black;color: white;text-decoration: none;display: flex;flex-direction: row;align-items: center;border-radius: 5px;justify-content: center;padding-top: 10px;
padding-bottom: 10px;width: 170px;}
.header_mail a{text-decoration: none;}
.toi_img{width: 20px; margin-right: 8px;margin-top: 2px;}
.header_mail:hover{opacity: 80%;}






  /*ここからヘッダー*/
  .nav-list{display: none;}
  .header_content_2{display: block;}
  /*#nav-drawer{display: block;}*/

  /*ヘッダー終わり*/

.sp{display: none;}




/*----------------------------
* メニュー開閉ボタン
*----------------------------*/
.menu-btn{
  position: fixed;
  top: 26px;
  z-index: 2;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #333;
  color: #fff;
  z-index: 1100;
}

/*----------------------------
* メニュー本体
*----------------------------*/
.menu{
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1;
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #555;
}
.menu__item{
  height: auto;
  padding: 30px 20px;
  text-align: center;
  color: #fff;
  box-sizing: border-box;
  font-size: 16px;
  margin-left: 40vw;
  padding-left: 31vw;
}
.menu_mt{border-top: 0.5px solid white;}
.menu a{text-decoration: none; width: 100%;border-block-end: 0.5px solid white;}
/*----------------------------
* アニメーション部分
*----------------------------*/

/* アニメーション前のメニューの状態 */
.menu{
  transform: translateX(-100vw);
  transition: all .3s linear;
}
/* アニメーション後のメニューの状態 */
.menu.is-active{
  transform: translateX(-70vw);
  z-index: 1000;
  opacity: 0.93;
}

.contact_matome{display: flex;}
.matome{width: 1102px;display: flex;justify-content: space-between;align-items: center;}
.header_tel{font-size: 18px; margin-top: 19px; display: flex; flex-direction: row; margin-right: 0px; width: 170px;}
.header_mail{width: 47%; margin-top: 5px;}
.header_mail img{width: 100%;}



@media screen and (max-width: 850px){
  .header_tel{font-size: 15px;}
  .header_content_2{width: 322px;}
  .header_bun{font-size: 14px;}
  .header_headline{width: 175px;}
  .pad{padding: 10px 70px;}
  .h1{top: 63%;font-size: 5.3vw;width: 80vw;text-align: center;}
  .h_eng{top:77%; font-size: 5vw;}
}


@media screen and (max-width: 740px){
  .image{margin-bottom: 0;}
  .pc{display: none;}
  .sp{display: block;}
  header .headline{margin-top: 0px;margin-right: 0px;margin: 0 auto;line-height: 95px;width: 170px;}
  .none{display: none;}
  .pad {padding: 0px;height: 67px;background: white;}
  #nav-open{top:26px; left: 20px;}
  .headline img{width: 80%;}
  .header_tytle {font-size: 17px;margin-top: 16px;color: black;width: 180px;width: 180px;margin-top: 0px;}
  .nav_toggle {top: 14px;left: 36vw;position: absolute;}
  .nav_menu_li{padding: 19px 40px; padding: 26px 40px;}
  .nav_menu_ul{padding: 25px 20px}
  .MENU {position: absolute; top: 137%; left: -5%; color: #333; font-size: 13px; }
  .header_tytle{left: 20vw;}
  .nav_menu_li {font-size: 4vw;}
  .matome {width: 100vw;display: flex;justify-content: space-between;align-items: center;}
  .contact_matome{display: none;}

  /*バナー*/
  .BANNER_MOJI {width: 100vw;}
  .slick-list{width: 100vw;}
  .slick-dots{width: 100vw;}
  .slick-dotted.slick-slider {width: 100vw;}
  .slick-next {display: none;}
  .slick-slider .slick-track, .slick-slider .slick-list {margin-top: 34px;}
  /*バナー*/


  .menu-btn {top: 13px;left: 6vw;margin-top: 5px;}
  .menu__item{width: 100%;height: auto;padding: 20px 20px;text-align: center;color: #fff;box-sizing: border-box;font-size: 15px;}
  .menu_mt{margin-top: -100px;}

   /* アニメーション前のメニューの状態 */
   .menu{transform: translateX(-100vw);transition: all .3s linear;}
   /* アニメーション後のメニューの状態 */
   .menu.is-active{transform: translateX(-30vw);z-index: 1000;}
   .menu__item{margin-left: 15vw;}
}