@charset "Utf-8";
@import url("reset.css");


/* ------------------------------
 Color
------------------------------ */

:root {	
	
	--color-main: #745024;
	--color-main-rgb: 116,80,36;
	--color-main-shade: #664620;
	--color-main-tint: #82623a;

	--color-point1: #ff8201;
	--color-point1-rgb: 255,130,1;
	--color-point1-shade: #e07201;
	--color-point1-tint: #ff8f1a;

	--color-point2: #9dc425;
	--color-point2-rgb: 157,196,37;
	--color-point2-shade: #8aac21;
	--color-point2-tint: #a7ca3b;
	
	
}

body{
	color: var(--color-main-shade);
	font-family: 'Jun 201';
	letter-spacing: 0.03em
}

h1,h2,h3{
	letter-spacing: 0.03em
}

body.facilitypage{
	background: url(../img/footer_bg.png) no-repeat center bottom;
	-moz-background-size:100% auto;background-size:100% auto;
}


.bold{font-family: 'Jun 501';}

/* ------------------------------
 Layout
------------------------------ */

.wrap,.wrappc{}

a.pagetop{display: block;
	font-size: 9px;
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center
}

a.pagetop:before{
	font-family: icomoon;
	content: "\e978";
	display: block;
	font-size: 30px;
}



/* その場で */
/* 表示前の状態 */
.fade-in {
  opacity: 0;
  transform: translateY(30px); /* 少し下にずらしておく */
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* 画面に入った時に付与するクラス */
.fade-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* 下からフェードイン */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


.fade {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 1.5s, transform 1s;
}

.fade.active {
	opacity: 1;
	transform: translateY(0px);
}

/*スクロール下からフェードイン  */
.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(50px);
    transition: opacity 1s,visibility 1s, transform 1s;
}

.scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}



@media screen and (max-width: 666px) {
	.wrap{width: 90%;
		margin: 0 auto}
	
	#contents{
	margin: 0 auto;
	padding: 0 0 0;}
	
	body:not(#home) #contents{
/* 		padding: 60px 0 0; */
	}
	
	#side_fix{display: none}
		
	
	.sfc_pc{display: none}
	
	br.brpc{display: none}
}	


@media screen and (min-width: 667px){
/*
	body:not(#home) #contents{
		padding: 80px 0 0;
	}
*/
	
	.wrap,.wrappc{
		width: 94%;
		margin: 0 auto}

	#contents{padding: 0 0 0;}

	br.brsp{display: none}
	
	a.pagetop{height: 100px}
}

@media screen and (min-width: 1360px){
	.wrap,.wrappc{
	width: 96%;
	max-width: 1200px;margin: 0 auto}
}





figure.asp4-3,
figure.asp16-9 {
  width: 100%;
}

figure.asp4-3 img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  position: relative;
  
}


figure.asp16-9 img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  position: relative;
  
}




/* ------------------------------
 #header
------------------------------ */

#header {
	height: 80px;
	background: url(../img/header_bg.svg) repeat-x;
	background-size: auto 110%;
}


body#home .site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  
  /* 初期状態：上に隠しておく */
  transform: translateY(-100%);
  transition: transform 0.3s ease; /* アニメーションの速度 */
}

body:not(#home) .site-header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

body:not(#home) #contents{
	padding: 80px 0 0;
}


/* JSで付与されるクラス：表示状態 */
body#home .site-header.is-show {
  transform: translateY(0);
}



.header_wrap{
	margin: 0 auto;
	display: flex;
	align-items: center;
	}
	
	
.header_wrap .header_logo{
	text-align: center
}
	
.header_wrap .header_logo p{
	font-weight: bold;
	line-height: 1.2em;
}

.header_wrap .header_logo img{
	width: 100%;
	height: auto
}

.header_list > li > a:hover{
	
}

@media screen and (max-width: 767px) {
	#header{
		position: fixed;
		height: 65px;
		top: 0;
		left: 0;
		width: 100%;
		z-index:1000;
	}
	
	.header_wrap{
		margin-right: 60px;
		height: 48px
	}
	
	.header_wrap .header_logo{
		padding:6px 15px 0 15px;
		position: relative;
		z-index: 1000;
	}
	.header_wrap .header_logo img{
		height: 28px;
		width: auto;
/* 		filter: invert(100%); */
	}
	.header_wrap .header_logo p{margin: 3px 0 0}
	
}




@media print, screen and (min-width: 768px) {
	#header {}
	.header_wrap {
		padding: 10px 0;
		width: 96%;
	}
	
	.header_wrap .header_logo{
	width: 180px;
	text-align: center
	}	
	
	.header_nav{
		width: calc(100% - 180px);
	}
}


@media print, screen and (min-width: 1025px) {

	.header_wrap .header_logo{
	width: 250px;
	text-align: center
	}	
	
	.header_nav{
		width: calc(100% - 250px);
	}

}



/* ------------------------------
 #header__nav
------------------------------ */

@media print, screen and (min-width: 768px) {
	
	.header_list {
	display: flex;
	justify-content: flex-end;
	margin: 1em 0
	}
	
	.header_list > li {
	  transition: background-color .3s;
	  position: relative;
	  margin: 0 5px
	}
		

	
	.header_list > li > a {
	  display: block;
	  padding: 4px 1em;
	  line-height: 1.2em;
	  font-weight: 700;
	  color: var(--color-main-shade);
	}
	
	.header_list > li a:hover,
	.header_list > li.current a {
	  background: var(--color-point2-shade);
	  border-radius: 50px;
	  position: relative;
	  color: #fff
	}
	
	.megaMenu {
	  transition: opacity .3s, visibility .3s;
	}
	
	.megaMenu {
	  background: #fff;
	  left: 0;
	  opacity: 0;
	  position: absolute;
	  text-align: center;
	  visibility: hidden;
	  width: 100%;
	  border-radius: 0px 0px 1em 1em;	  
	}
	.megaMenu > ul {
	}
	.megaMenu > ul > li {
	  display: inline-block;
	}
	/* メニューをhoverした時のスタイル */
	.header_list > li:hover .megaMenu {
	  opacity: 1;
	  visibility: visible;
	}
	
	.megaMenu > ul > li a{
		display: block;
	  padding: .6em 1em;}
	  
	.megaMenu > ul > li:not(:last-child) a{
		border-bottom: solid 1px var(--color-main);
	}


}


@keyframes anime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}



/* ------------------------------
 #opengnav 格納メニュー
------------------------------ */

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


	/*========= ボタンCSS ===============*/
	
	.openbtn,
	.openbtn span {
	display: inline-block;
	transition: all 0.3s;
	}
	
	.openbtn{
	width: 30px;
	height: 22px;
	position: absolute;
	z-index: 500;
	right: 20px;
	top:22px;
	}
	
		
	/*×に変化*/	
	.openbtn span{
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: 50px;
	background-color: #fff;
	}
		
	
	.openbtn span:nth-of-type(1) {top: 0;}
	.openbtn span:nth-of-type(2) {top: 9px;}
	.openbtn span:nth-of-type(3) {top: 18px;}
	
	
	.openbtn.active span:nth-of-type(1) {
		transform: translateY(10px) rotate(-45deg);
		top:0px;
		background-color: #fff;
	}
	
	.openbtn.active span:nth-of-type(2) {
		transform: translateY(0px) rotate(45deg);
		background-color: #fff;
	}
	
	.openbtn.active span:nth-of-type(3){
		opacity: 0
	}
	
	
	
	@media screen and (max-width: 767px) {
		.openbtn{}
		.openbtn:after{letter-spacing: 0}
	}	
	

	/*========= ナビゲーションCSS ===============*/
	
	
	#opengnav nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: var(--color-main-shade);
    z-index: 50;
    opacity: 0;
    visibility: hidden; 
    pointer-events: none;
    transition: all 0.6s ease;
	  }
	
	  /* アクティブクラスがついたら認識させる */
	  #opengnav nav.panelactive {
	    opacity: 1;
	    visibility: visible;
	    pointer-events: auto;
	  }
	
	
	/*ナビの数が増えた場合縦スクロール*/
	#opengnav nav.panelactive .nav_scloll{
	    position: fixed;
	    z-index: 50; 
	    height: 100vh;
	    width: 100%;
	    overflow: auto;
	    -webkit-overflow-scrolling: touch;
	}
	
	
	/*ナビゲーション*/
	.nav_scloll{
		position: relative;
		z-index: 50;
	}
	
	
	.nav_wrap{
		padding: 65px 0 0;
	}
	
	.nav_wrap ul li a{
		display: block;
		font-size: 1.2em;
		padding: 1em;
		border-bottom: solid 1px rgba(255, 255, 255, 0.4);
		position: relative;
		color: #fff;
		font-weight: 700
	}
	
	
	.gnav_top{
		display: none
	}
	ul.header_list > li a:after{
		font-family: icomoon;
		content: "\e977";
		color: var(--color-main);
		position: absolute;
		right: .8em;
		color: #fff;
	}

	ul.header_list > li.gnav_job{
		padding: 10px;
	}

	
	ul.header_list > li.gnav_job a{
		background: var(--color-secondary);
		color: #fff;
		border-radius: 50px;
		line-height: 1em;
		text-align: center
	}
	
	ul.header_list > li.gnav_job a:after{
		color: #fff;
		
	}
	
	

	ul.header_list > li.gnav_co > a{
		background: rgba(var(--color-main-rgb), 0.3);
	} 

	.megaMenu li:not(:last-child) a{
		border-bottom: solid 1px #ccc
	}
	
	
	ul.header_list li ul li.gnav_co a:after{
		color: var(--color-main);
		
	}
	
	ul.header_list li span{
		padding-left: 1em;
		font-size: .8em
	}


}



@media print, screen and (min-width: 768px) {
	.openbtn{display: none}
}



/* ------------------------------
 post
------------------------------ */


.postindex_title{
	background: rgba(var(--color-main-rgb), 0.5);
	padding: 2em 1em;
}

.postindex_title h1{
	font-size: 1.2rem
}


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

@media print, screen and (min-width: 768px) {
	.postindex_title{
	background: rgba(var(--color-main-rgb), 0.5);
	padding: 4em 1em;
	}
	.postindex_title h1 br{
		display: none
	}
}	

@media print, screen and (min-width: 1024px) {}	


.postindex{
	padding: 3em 0;
}

ul.postindex_list{
	display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 30px;
}

ul.postindex_list h2{
	font-size: 1.1rem
}

ul.postindex_list li figure{
	position: relative;
	width: 100%;
	margin-bottom: 1em;
	cursor: pointer;
  transition: all 0.2s ease;
  
  /* 浮かんでいる状態の影 */
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  overflow: hidden;
}



ul.postindex_list li figure::after{
	font-family: icomoon;
	content: "\e977";
	position: absolute;
	right: .8em;
	bottom: .8em;
	font-size: 1.5em;
	color: #fff;
	text-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
}



ul.postindex_list li figure img{
	width: 100%;
	height: auto;
	aspect-ratio: 5 / 3;
	object-fit: cover;
	border-radius: 5px;
	position: relative;
	display: block;
}

/* ホバーした時の動き */
ul.postindex_list li figure:hover {
  transform: translateY(4px); /* 下に4px移動 */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 影を小さくして接地感を出す */
}

ul.postindex_list li ul{
	display: flex;
}

ul.postindex_list li ul li{
	font-size: .9em;
	color: #666
}

ul.postindex_list li ul li:not(:last-child){
	padding: 0 1em 0 0;
}

.postsingle{
	max-width: 900px;
	width: 90%;
	margin: 0 auto 4em
}

.postsingle header{
	margin-bottom: 2em;
}

.category_title{
	margin-bottom: 1em
}

.category_title h1{
	font-size: 1.2rem
}

/* ------------------------------
 よく使う
------------------------------ */

.gback{background:var(--color-main);color: #f1eee7}
.gback a{color: #f1eee7}


.gfont{color: var(--color-main)}


ul.hlbox li{
	display: flex;
	justify-content: center;
	flex-wrap:wrap;
	margin: 2em 0 0 0
}

ul.hlbox li div:nth-child(1){
	width: 120px
}

ul.hlbox li div:nth-child(2){
	width: calc(100% - 120px);
	padding-left: 1.6em
}

ul.hlbox li .date{display: inline-block;margin-right: 1em}
ul.hlbox li .cat{
	background:#fff;
	font-size: .8em;
	padding: 0 5px
}




/* ------------------------------
 swiper
 ------------------------------ */
.swiper,
.workswiper,
.bannerwiper,
.relatedswiper1,
.relatedswiper{
	overflow: hidden;
	position: relative
}


.banner{
	margin: 0 0 0 5%
}


@media screen and (max-width: 667px) {
	.relatedswiper,
	.relatedswiper1{margin-left: 5%}
}

.bannerwiper{margin-bottom: 5%}

.swiper-slide{ height: auto; }

.swiper-button-next,
.swiper-button-prev {
    --swiper-navigation-color: #000}


.swiper-button-next:after,
.swiper-button-prev:after {font-size: 18px !important;}

@media screen and (max-width: 667px) {
	.swiper-button-next:after,
	.swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: 13px !important;
    }
}	

@media print, screen and (min-width: 668px) {
	.swiper-button-prev, .swiper-rtl .swiper-button-next{
		left: 0
	}
	.swiper-button-next, .swiper-rtl .swiper-button-prev{
		right: 0
	}
}	

@media print, screen and (min-width: 1000px) {}	




/* ************************************************ 
*	同じグループの関連リンク
* ************************************************ */

#related{margin-top: 8%}
#related h3{
	line-height: 1.1em;
	margin: 2em 0 1.2em 0;
	text-align: center;
	letter-spacing: 1px
}


.relatedswiper ul li{
	position: relative;
	padding: 1em 1em 1em 0
}

.relatedswiper ul li span{
	display: block;
	padding: .6em .8em;
}

.relatedswiper ul li a{
	display: block;
	box-shadow: 1px 1px 6px #ccc;
}

#related ul li img{
}

@media screen and (max-width: 667px) {
	.relatedswiper{margin-left: 5%}
	#related h3{margin: 2em 1em 1.2em 1em};
}	

@media print, screen and (min-width: 668px) {
	#related h3{font-size: 1.5em}
	.relatedswiper{margin: 0 auto 2em}
	.relatedswiper ul{
	display: flex;
	flex-wrap:wrap;
	}
	
	.relatedswiper ul li{
	width: calc(( 100% - 50px ) / 3 );
	margin: 0 25px 25px 0;
	}
	
	.relatedswiper ul li span{padding: 1em 1.3em;}
	.relatedswiper ul li:nth-child( 3n ) {margin-right: 0;}
}	

@media print, screen and (min-width: 1024px) {}	




/* ------------------------------
 sns
------------------------------ */

@media print, screen and (min-width: 1000px) {}	

#snslink ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	font-family: serif
}

#snslink li{margin: 0 1em}

#snslink a{color: #fff;text-decoration: none;font-size: 1.2em}

a.ig:before{
	font-family: sns;
	content: "\e903";
	padding-right: .3em
}

a.fb:before{
	font-family: sns;
	content: "\e90d";
	padding-right: .3em
}


a.tw:before{
	font-family: sns;
	content: "\e611";
	padding-right: .3em
}

a.line:before{
	font-family: sns;
	content: "\e009";
	padding-right: .3em
}

a.pinta:before{
	font-family: sns;
	content: "\e63a";
	padding-right: .3em
}

a.plane:before{
	font-family: sns;
	content: "\e900";
	padding-right: .3em
}

a.yt:before{
	font-family: icomoon;
	content: "\e912";
	padding-right: .3em
}

a.ns:before{
	font-family: sns;
	content: "\e902";
	padding-right: .3em
}

a.map:before{
	font-family: icomoon;
	content: "\e9ee";
	margin-right: .3em
}


a.hp:before{
	font-family: icomoon;
	content: "\ea73";
	margin-right: .3em
}

a.call:before{
	font-family: icomoon;
	content: "\e905";
	margin-right: .3em
}

a.home:before{
	font-family: icomoon;
	content: "\e908";
}

a.event:before{font-family: icomoon;content: "\e9b5";}
a.sodan:before{font-family: sns;content: "\e90f";}
a.contact:before{font-family: sns;content: "\e900";}

a.works:before{
	font-family: icomoon;
	content: "\e9d6";
}

a.madori:before{
	font-family: icomoon;
	content: "\ea30";
}



/* ------------------------------
 ページコンテンツ共通スタイル
------------------------------ */

#page_header{
	text-align: left;
	margin:5% auto 8%;
}

#page_header h1{
	padding:3px 0 3px 5%;}
	
#page_header h1 span{display: block;
	font-size: 1.5em;padding: 10px 0 0 0;color: var(--color-main)}


@media screen and (max-width: 667px) {
	#page_header p{
		margin-top: 1em
	}
}	

@media print, screen and (min-width: 668px) {
	#page_header{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
	}
	#page_header h1{
		font-size:24px;
		padding-left: 3%;
		border-left: solid 3px var(--color-main)
	}
	.ctitle{font-size: 20px;margin: 8% auto 3%;}
}	

@media print, screen and (min-width: 1024px) {
	#page_header h1{font-size:30px}
	.ctitle{font-size: 26px}
}	

a.btag{}

a.btag:before{
	font-family: icomoon;
	content: "#";
}


/* ************************************************ 
*	CTA
* ************************************************ */


#cta{
	text-align: center;
	margin: 0 auto;
	background: rgba(240, 240, 224, 0.8)
}
#cta h4{
	font-size: 1.2em;
	margin-bottom: 1em;
	line-height: 1.6em;
}

#cta h4 br,#cta p br{display: none}

#cta p{margin-bottom: 1em;font-size: 1.1em}

ul#cta_contact{width: 90%;margin: 0 auto}

ul#cta_contact li{letter-spacing: .1em;
	font-size: 1.3em;
	text-align: center
}

ul#cta_contact li a,
ul#cta_contact li.cta-tel-pc span{
	display: block;
	border: solid 2px #301816;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	padding: .8em .5em;
	text-decoration: none;
	color: #fff;
	background: #301816;
	font-weight: bold
}




ul#cta_contact li a:hover{
	background: #fff;
	color: #301816
}

ul#cta_contact li.cta-tel a:before,
ul#cta_contact li.cta-tel-pc span:before{
	font-family: icomoon;
	content: "\e905";
	margin-right: .5em
}

ul#cta_contact li.cta-tel-pc a:hover{}

ul#cta_contact li.cta-form a:before{
	font-family: icomoon;
	content: "\e904";
	margin-right: .5em
}

@media screen and (max-width: 667px) {
	ul#cta_contact li:first-child{
		margin-bottom: 1em
	}
}	

@media print, screen and (min-width: 668px) {
	#cta{}
	#cta h4{font-size: 1.4em;}
	ul#cta_contact li.cta-tel,
	ul#cta_contact li.cta-tel-pc{
		float: left;
		width: 48%
	}
	ul#cta_contact li.cta-form{
		float: right;
		width: 48%;
	}

}	

@media print, screen and (min-width: 1024px) {
	ul#cta_contact{width: 80%}
}	




/* ************************************************ 
*	.bread_crumb
* ************************************************ */

#bread{
	padding: 1.5em 1em 1em;
	margin-bottom: 2em
}

.rank-math-breadcrumb{
	font-size: 13px;
}



#bread a{text-decoration: none;color: #444}

ul.bread_crumb{}
	
ul.bread_crumb li{display: inline-block;
	font-size: clamp(0.75rem, 0.705rem + 0.23vw, 0.875rem)
}

ul.bread_crumb li br{display: none}

ul.bread_crumb li + li:before {
	margin: 0 .6em;
	font-size: 1.1em;
	color: #999;
	font-family: icomoon;
	content: "\e977";
}

@media screen and (max-width: 667px) {	
	ul.bread_crumb li{}
}	

@media print, screen and (min-width: 668px) {
	#bread{padding: 1.5em;}
}

/* ************************************************ 
*	prevnext
* ************************************************ */

.pagenav{
	max-width: 1240px;
	margin: 3% auto;
}

.pagenav li {
	margin:0 0 .6em;
	font-size: .8em
}

.pagenav li a{
	display: block;
	text-decoration: none;
	padding: .3em .8em;
	position: relative;
	color: #444;
	-webkit-transition: all .3s;
	transition: all .3s;
	}

	
.pagenav li a:hover{color: #510000}	
.pagenav li.prev{text-align: left;}

.pagenav li.prev a{}

.pagenav li.prev a:before{
		font-family: icomoon;
		content: "\e973";
		padding-right: .5em}
	
.pagenav li.next{text-align: right;}

.pagenav li.next a:after{
	font-family: icomoon;
	content: "\e974";
	padding-left: .5em}

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

@media print, screen and (min-width: 668px) {
	.pagenav{
		display: flex;
		justify-content: space-between;
		flex-wrap:wrap;
	}
	.pagenav li{width: 45%}
}	
	


.pageback {display: block;
	margin: 0 auto;
	background: #007fa8;
	color: #fff;
	padding: .6em 1em;
	text-align: center;
	max-width: 400px;
}

.pageback:before{
	font-family: icomoon;
	content: "\e973";
	padding-right: 5px
}



/* ************************************************ 
*	Pager
* ************************************************ */

#pager{overflow: hidden;
    position: relative;}
    
    
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2em 0 3em;
    position: relative;
}

.pagination span, .pagination a {
    display: block;
    width: auto;
    margin: 4px 6px;
    padding: 8px;
    color: #000;
    background-color: #fff;
    text-decoration: none;
    text-align: center;
    line-height: 16px;
    position: relative;
    border-bottom: solid 3px #FFF
}



/* ページ番号 */
.pagination .pager{
    width: 32px;
}

/* ホバー時 & 現在のページ */
.pagination a:hover,
.pagination .current  {
    border-bottom: solid 3px #000
}

/* 前へ */
.pagination a.before {
    margin-right: 16px;
}
/* 次へ */
.pagination a.next {
    margin-left: 16px;
}
/* 最初へ */
.pagination a.first {}
/* 最後へ */
.pagination a.last {}

/* Page x / y */
.pagination span.page_num {
    display: none;
}


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

#footer{
	margin: 0 auto;
	text-align: center;
	position: relative;
	padding: 6% 5%;
}

.footer_cta{
	margin: 0 auto
}


.cta_form ul{}

/* .cta_form ul li{width: 48%} */
.cta_form ul li a{
	display: block;
	background: #fff;
	color: var(--color-main);
	padding: 1em 0;
	line-height: 1em;
	font-size: 1.1em;
	font-weight: bold
}

.cta_form ul li a:before{
	padding-right: 1em
}

.cta_form .to_ob{text-align: left;padding-top: .7em}
.cta_form .to_ob:before{
	font-family: icomoon;
	content: "\e977";
}

@media screen and (max-width: 768px) {
	#footer{padding: 5% 6% 55px;}
	.cta_daial{margin-bottom: 2em}
}	

@media print, screen and (min-width: 768px) {
	.footer_cta{width: 90%;padding: 3em 0 2em;}
}	

@media print, screen and (min-width: 769px) {

	.footer_cta{
	display: flex;
	justify-content: center;
	gap:20px;
	flex-wrap:wrap;
	align-items: center;}
	.cta_daial{width: 40%}
	.cta_form{min-width: 40%}
}	



@media print, screen and (min-width: 1200px){
	.cta_form{padding-left: 40px;}
	.cta_form ul li{}
}




.iemori119{}


.iemori119 dl{margin-bottom: 2em;}
.iemori119 dl dd{text-align: left;font-size: .9em}


.iemori119 ul{
	display: flex;
	flex-wrap:wrap;
	margin: 0 auto 1em;
	font-size: .9em;
}

.iemori119 ul li:not(:last-child):after{
	content: "｜"
}

@media screen and (max-width: 768px) {
	.iemori119 dl dt{text-align: center;margin: 2em auto 1em}
}

@media print, screen and (min-width: 667px) {
	.iemori119 dl{
		display: flex;
		justify-content: center;
		align-items: center;}
		
	.iemori119 dl dt{padding-right: 2em}
}

@media print, screen and (min-width: 1025px) {

	.iemori119 ul{max-width: 1000px;margin: 0 auto 2em;}

}	

.cr{
	padding: 1.5em;
	font-size: .8em;
	letter-spacing: .1em;
}




@media print{
	#footer{display: none}
}



/* ------------------------------
 Youtube
------------------------------ */	

.video-container {
   position: relative;
     padding-bottom: 56.25%;
     height: 0;}
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}