@charset "utf-8";
/* CSS Document */
#wrap{
	width: 100%;
	overflow: hidden;
}

body{
	font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
	/*font-family: 'Noto Serif JP', serif;*/
	color: #716c6c;/*#444242*/
}
/*ヘッダーメニュー*/
#top_logo {
    position: fixed;
    z-index: 880;
    padding-top: 10px;
    padding-left: 18px;
    background-color: rgba(255,255,255,0.85);
    width: 100%;
    line-height: 58px;
}
/*#top_logo{
	position: fixed;
    z-index: 880;
    padding-top: 14px;
    padding-left: 10px;
    background-color: rgba(255,255,255,0.85);
    width: 100%;
    line-height: 49px;
}*/
#top_logo img{
	width: 33%;
}
#footer_logo img{
width: 34%;
}
@media screen and (min-width: 750px){
#top_logo {
    position: fixed;
    z-index: 1000;
    padding-top: 10px;
    padding-left: 18px;
    background-color: transparent;
    width: 200px;
    line-height: 58px;
}
	
	#top_logo img{
	    width: 72%;
	    background-color: #fff;
}
}
#main{
	margin-top: 1rem;
}
/*#hamburger{
	background: #444;
	height: 69px;
}*/
#hamburger .btn-gNav{
  position: fixed;
  top: 20px;
  right: 20px;
  width: 30px;
  height: 24px;
  z-index: 903;
  box-sizing: border-box;
  cursor: pointer;
  -webkit-transition: all 400ms;
  transition: all 400ms;
}
#hamburger .btn-gNav span{
  position: absolute;
  width: 100%;
  height: 4px;
  /*background: #666;*/
	background: #e2ddd8;
  border-radius: 10px;
  -webkit-transition: all 400ms;
  transition: all 400ms;
}
#hamburger .btn-gNav span:nth-child(1) {
  top:0;
}
#hamburger .btn-gNav span:nth-child(2) {
  top:10px;
}
#hamburger .btn-gNav span:nth-child(3) {
  top:20px;
}
#hamburger .btn-gNav.open span:nth-child(1){
  background: #fff;
  top: 6px;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
}
#hamburger .btn-gNav.open span:nth-child(2),#hamburger .btn-gNav.open span:nth-child(3){
  top: 6px;
  background :#fff;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}
#gNav{
  position: fixed;
  top: 0;
  right: -100%;
  width: 50%;
  height: 100%;
  /*background-color: #444;*/
  font-size: 16px;
  box-sizing: border-box;
  z-index: 902;
  padding-top: 50px;
  transition: .8s;
}
#gNav.open{
  right: 0px;
  background-color: #444;
}
#gNav .gNav-menu{
  width: 100%;
  /*height:100%;*/
  display: flex;
  flex-direction: column;
  text-align: center;
  /*justify-content: center;*/
}
#gNav .gNav-menu li{
  display: block;
  padding : 20px 12px;
}
#gNav .gNav-menu li a{
  color: #444;
  text-decoration: none;
  font-weight: 500;
}


/*#gNav .gNav-menu li a:hover{
  border-bottom: 1px solid #444;
  transition: transform .2s;
}
*/
.hover-Uline{
  position: relative;/*疑似要素の親を固定*/
  cursor: pointer;/*カーソルをポインターへ*/
  text-decoration: none;/*ホバーなしは非表示*/
}
.hover-Uline:before {
  content: ""; /*疑似要素の中身は空（記述は必須）*/
  position: absolute; /*子要素として疑似要素を固定*/
  left: 0; /*長さはテキストの両端まで*/
  right: 0; /*長さはテキストの両端まで*/
  bottom: 12px;  /*線の上下位置*/
  width: 100%; /*線の長さ*/
  height: 2px; /*線の太さ*/
  background-color: #9e9c9c; /*線の色*/
  transform: scale(0, 1); /*横方向に0状態から全体まで線を入れる*/
  transform-origin: center; /*中央を起点にアニメーション*/
  transition: transform .2s; /*アニメーションの時間*/
}

.hover-Uline:hover:before {
  transform: scale(1); /*ホバー時に等倍へ拡大*/
}



#footer_logo img{
width: 30%;
}


@media screen and (min-width: 750px){
  .btn-gNav{
    display: none;
  }

#gNav.open {
    background-color: transparent;
}
	
  #gNav{
    position: fixed;
    top: 0;
    right: 0;
    height: 69px;
	width: 100%;
	  background-color: rgba(255,255,255,0.85);
  }
  #gNav .gNav-menu{
    display: flex;
    justify-content: flex-end;
    flex-direction: row;
    /*height: 100%;*/
    position: fixed;
    top: 21px;
    right: 12px;
  }
  #gNav .gNav-menu li{
    padding-top: 5px;
  }
}

/*ここから新しく追加*/
/* 親メニュー */
.menu-item {
  position: relative;
}

/* メガメニュー本体 */
.mega-menu-content {
  display: none;
  gap: 30px;
  position: absolute;
  top: 100%;
  left: 0;
  text-align: left;
  width: 400px;
  background: #fff;
  justify-content: flex-start;
  padding: 20px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  writing-mode: horizontal-tb;
  transform: none;
}

/* hoverで表示 */
.menu-item:hover .mega-menu-content {
  display: flex;
}


/* カラム */
.column {
  flex: 1;
  min-width: 220px;
  padding: 0 15px;
}

/* リンク */
.mega-menu-content a {
  writing-mode: horizontal-tb;
  display: block;
  padding: 8px 10px;
  transition: all 0.2s;
  color: #333;
  white-space: nowrap;
}
.mega-menu-content a:hover {
  color: #007aff;
  background: #f5f7fa;
}
/*ここまで新しく追加*/


/*フッターメニュー*/

#footer{
	width: 100%;
	background-color: #fff;
	padding-bottom: 30px;
}
#footer_logo{
/*	width: 100px;*/
    padding-top: 30px;
    margin-bottom: 30px;
/*    margin-right: auto;
    margin-left: auto;*/
	text-align: center;
}

#footer_text p{
	text-align: center;
}
#footer_text p:nth-child(1){
	font-size: 0.7rem;
	margin-bottom: 10px;
}
#footer_text p:nth-child(2){
	font-size: 0.6rem;
}

#footer_ul{
	width: 80%;
	margin: 0 auto;
	margin-bottom: 34px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

#footer_ul li{
	padding: 2px;
    width: 100px;
    text-align: center;
}

#footer_ul li a{
  color: #444;
  text-decoration: none;
  line-height: 2.2rem;
  font-size: .8rem;
}
#footer_ul li a:hover{
  color: #F1EDE9;
  transition-duration: 300ms;
}
#footer_text{
	max-width: 400px;
    margin: 0 auto;
}

@media screen and (max-width: 750px){
#gNav .gNav-menu li a {
    color: #ddd;
    text-decoration: none;
	line-height: 2rem;
    padding: 1.3rem 20px;
}
#gNav .gNav-menu li a:hover{
    color: #F1EDE9;
	font-weight: bold;
}
}
@media screen and (min-width: 950px){
#footer_logo img{
width: 12%;
}
}
