/*
Theme Name: YawarakaZen
Author URI: https://wordpress.org/
Version: 1.0
Author: Saki Matsumoto

*/



html {scroll-behavior: smooth;}

body {
  color: #333;
  font-family: "Yu Gothic", YuGothic, Helvetica, Arial,
  "Hiragino Kaku Gothic ProN",
  Meiryo, メイリオ, sans-serif;
  margin: 0;
  background-color: #fbfbfb;
}

p {
  text-align: left;
  font-size: 16px;
  line-height: 2;
}

img {
  max-width: 100%;
}

ul {
  list-style: none;
}

a {
  transition: color .3s;
  text-decoration: none;
  color: #444;
}

.sp-br{
  display: none; /* SPの改行を隠す */
}

/* コンテンツをふわっと出現 */

nav ul {
  margin: 0;
  padding: 0;
}



.fadein {
  opacity : 0;
  transform : translate(0, 6px);
  transition : all 700ms;
}

.fadein.scrollin {
  opacity : 1;
  transform : translate(0, 0);
}


.fadein-2 {
  opacity : 0;
  transform : translate(0, 5px);
  transition : all 700ms;
}

.fadein-2.scrollin {
  opacity : 1;
  transform : translate(0, 0);
  animation-delay: 3.2s;
}


.fadein3 {
  opacity : 0;
  transition : all 1s;
}
  
.fadein3.active{
  opacity : 1;
}

.fadein4 {
  opacity : 0;
  transition : all 1s;
}
  
.fadein4.active{
  opacity : 1;
}




#wrapper {
  width: 1000px;
  margin: 0 auto;
}


.bold{
  font-weight: bold;
}

.medium{
  font-size: 18px;
}



  /** -----------------------------------
      ヘッダー
  -------------------------------------**/
.header__title{
  width: 185px;
  margin-right: 55px;
  margin-top: 10px;
}

.header__title img{
  vertical-align: middle;
}


nav{
  max-width: 1000px;
}



#navArea{
  display: none;
}

/** -------- タブレット -------- **/
@media screen and (max-width: 1024px){
}

@media screen and (max-width: 800px){

}



  /** -----------------------------------
      footer
  -------------------------------------**/

  .copyright a:hover{
    color: #333;
  }


  /** -------- タブレット -------- **/
  @media screen and (max-width: 1024px){
    #footer_contact .medium {
        font-size: 14px;
        margin: 0;
      }
    
    .footer_qa a {
      font-size: 14px;
    }

  }
  /** -------- スマホ-------- **/
  @media screen and (max-width: 699px) {
    #footer_contact .button a {
      font-size: 13px;
      padding: 1em;
      width: 320px;

  }

  }

  @media only screen and (max-width: 599px) {

    .sp-br{display: block;}

        .footer07 a {
          font-size: 12px;
        }
    
        .footer07 ul {
          display: block;
          text-align: left;
        }
    
    
        .footer07 li {
          padding: 10px 40px;
        }
  }


  @media only screen and (max-width: 330px) {
    .footer_right{
      display: none;
    }

  }

  @media screen and (max-width: 480px) {

    .footer_button {
      max-width: 350px;
      flex-wrap: wrap;
      margin: 0 auto;
  }

  }





/* ページナビゲーション */

.wp-pagenavi{
  text-align: center;
  margin-top: 80px;
}

.wp-pagenavi a, .wp-pagenavi span {
	color:#999;
	background-color:#FFF;
	padding: 8px 15px;
    margin:0 2px;
	white-space: nowrap;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
.wp-pagenavi a:hover{
	color:#FFF; 
	background-color:#999; 
	border-color:rgb(255, 255, 255);
	}
.wp-pagenavi span.current{
	color:#FFF;
  background-color: #b5c7d0;
  border-color: #b5c7d0;
  font-weight: normal;
	}

.pages{
  display: none;
}

/* 

ナビゲーション

*/



/*==ナビゲーション全体の設定*/
nav{
  color:#fff;
}
/*ナビゲーションを横並びに*/
nav ul{
  list-style: none;
  /* display: flex; */
  justify-content: center;
}
/*2階層目以降は横並びにしない*/
nav ul ul{
  display: block;
}

/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
nav ul li{
  position: relative;
}

/*ナビゲーションのリンク設定*/
nav ul li a{
  display: block;
  text-decoration: none;
  transition:all .3s;
}

nav ul li li a{
  padding:10px 35px;
}

nav ul li a:hover{
  color:#fff; 
}


/*== 2・3階層目の共通設定 */

/*下の階層を持っているulの指定*/
nav li.has-child ul{
    /*絶対配置で位置を指定*/
  position: absolute;
  left:0;
  top:62px;
  z-index: 4;
    /*形状を指定*/
  background:#769caf;
  width:350px;
    /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
    /*アニメーション設定*/
  transition: all .3s;
}

/*hoverしたら表示*/
nav li.has-child:hover > ul,
nav li.has-child ul li:hover > ul,
nav li.has-child:active > ul,
nav li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;

}

/*ナビゲーションaタグの形状*/
nav li.has-child ul li{
  color: #fff;
  border-bottom:solid 1px rgba(255,255,255,0.6);
}

nav li.has-child ul li:last-child a{
  border-bottom:none;
}




.has-childlia:hover{
  padding: 15px;
}


/* ハンバーガー非表示 */
.hamburger-menu{display: none;}

