@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

.l-content {
	margin-bottom:0;
}
.l-header .l-header__inner {
	color:#4C4C4C !important;
}
.sp {
	display:none !important;
}

body {
	font-family: 'Zen Kaku Gothic New', sans-serif;
}
.top #content {
	padding-top:0;
}
h1, h2, h3, h4, h5, .read{
font-family: 'Zen Kaku Gothic New', sans-serif;
	letter-spacing:0.2em !important;
}
h2 {
	font-size:30px !important;

}
.read {
	font-size:18px !important;
	font-weight:400 !important;
}
h3.ttl span{
	border-bottom:solid 4px #49534E;
	padding-bottom:0.5em;
}
/*
 h3.ttl.yellow span{
	border-bottom:solid 4px #BBAB74;
	padding-bottom:0.5em;
}
*/
h4 {
	font-weight:normal !important;
}
h4.sub-ttl {
	border-bottom:solid thin #49534E !important;	
	padding-bottom:0.5em !important;
	font-weight:bold !important;
}
#fix_bottom_menu .menu-item i, #fix_bottom_menu span {
	color:#4B5F55!important;
}
@media screen and (max-width: 768px) {
  /* 768px以下に適用されるCSS（スマホ用） */
  .sp {
  display:block !important; 
  }
  .pc {
    display: none !important;
}
@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
	h2 {
		font-size:24px !important;
	}
	h3 {
		font-size:20px !important;
	}
	h4 {
		font-size:20px !important;
	}
	.sp-left {
	text-align:left;
}
	.time table {
	font-size: 12px;
	}
	}

/***************************
 * デフォルトのナビゲーションを非表示
 * *************************/
.p-spMenu__nav{
	display:none;
	}
.c-widget__title.-spmenu{
		display:none;
	}
/***************************
 * デフォルトのナビゲーションをカスタム
 * *************************/
		/* 元々の背景透過の調整 */
	.p-spMenu__inner::before {
		opacity:1 !important;		
	}
		/* ブログパーツでデザインした部分 */	
	#sp-nav p {
		font-size:1em;
		letter-spacing:0.2em;
		font-weight:bold;
	}
	#sp-nav p span{
		border:solid thin #fff;
		padding:0.5em 4em;
	}
	#sp-nav .contact-btn {
		margin-top:3em;
	}
		/* アイコン部分 */

	#sp-nav .spnav-icon {
    border: solid 1px;
    border-radius: 50px;
    width: 40px;
    height: 40px;
    display: flex!important;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 2px 0 0 3px;	
	}
	#sp-nav .icon-2coloumn {
		width:100px;
		margin:0 auto;
	}
	
/***************************
 * ナビゲーションをフェードに変更　ここから
 * *************************/
	/* 元々あるハンバーガーアイコンを非表示に */
.c-iconBtn__icon {
  display: none;
}

/* ハンバーガーの3本線をCSSで作成 */
.l-header__menuBtn {
  position: relative;
}

.c-iconBtn {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 25px;
  height: 2px;
  background-color: #333;
  transition: background-color 0.3s;
}

.c-iconBtn::before,
.c-iconBtn::after {
  content: "";
  display: block;
  width: 25px;
  height: 2px;
  background-color: inherit;
  position: absolute;
  transition: transform 0.125s;
}

.c-iconBtn::before {
  top: -7px;
}

.c-iconBtn::after {
  top: 7px;
}

/* ハンバーガーがクリックされた時の動き */
[data-spmenu="opened"] .c-iconBtn {
  width: 100%;
  height: 100%;
  background-color: transparent;
}

[data-spmenu="opened"] .c-iconBtn::before,
[data-spmenu="opened"] .c-iconBtn::after {
  top: auto;
  background-color: #fff;
  transition: transform 0.3s;
}

[data-spmenu="opened"] .c-iconBtn::before {
  transform: rotate(45deg);
}

[data-spmenu="opened"] .c-iconBtn::after {
  transform: rotate(135deg);
}

/* スマホ開閉メニューのデザインを調整 */
.p-spMenu__inner {
  width: 100vw;
  height: 100%;
  --color_menu_bg: rgba(75, 95, 85, 1); /* 開閉メニューの背景色 */
  color: #fff; /* メニューテキストの色 */
  transition: all 0.45s ease-out;
  z-index: 1;
}

.p-spMenu__inner::before {
  background-color: var(--color_menu_bg);
}

.p-spMenu__overlay {
  background-color: transparent;
}

/* クリック時のスマホ開閉メニューの動きをドロワーからフェードに変更 */
.-right .p-spMenu__inner {
  transform: translateX(0);
  opacity: 0;
  transition: opacity 0.45s;
}

[data-spmenu="opened"] .p-spMenu__inner {
  transform: translateX(0);
  opacity: 1;
}
	/***************************
 * ナビゲーションをフェードに変更　ここまで
 * *************************/
	