@charset "UTF-8";
#wrapper {
	overflow: hidden;
}
.container768 {
	max-width: 768px;
	margin: 0 auto;
	padding: 2rem 1rem;
}
.container1024 {
	max-width: 1024px;
	margin: 0 auto;
	padding: 2rem 1rem;
}
.container1280 {
	max-width: 1280px;
	margin: 0 auto;
	padding: 2rem 1rem;
}
.marker {
	display: inline;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(0%, #ff99ab));
	background: -webkit-linear-gradient(transparent 70%, #ff99ab 0%);
	background:      -o-linear-gradient(transparent 70%, #ff99ab 0%);
	background:         linear-gradient(transparent 70%, #ff99ab 0%);
	/*横に余白をつけたり、下にずらしたりするときは以下のpaddingを調整してください*/
}
.mincho {
	font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN","游明朝", YuMincho, "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
	font-weight: 500;
}
.line {
	padding-bottom: 0.1em;
	background-color: #fff;
	background-image: -webkit-linear-gradient(left, #fff 1.1px, transparent 1px), -webkit-linear-gradient(bottom, #ccc 1.1px, transparent 1px);
	background-image:      -o-linear-gradient(left, #fff 1.1px, transparent 1px), -o-linear-gradient(bottom, #ccc 1.1px, transparent 1px);
	background-image:         linear-gradient(to right, #fff 1.1px, transparent 1px), linear-gradient(to top, #ccc 1.1px, transparent 1px);
	background-size: 2px 2.2em;
	line-height: 2.2;
}
.btn-contact {
    text-shadow: 0 -1px 1px rgba(122, 42, 0, 0.63);
    text-align: center;
    border: 1px solid #67abb6;
    border-right-color: #568890;
    border-bottom-color: #447178;
    border-radius: 3px;
    background-color: #59cad0;
    background-image: -webkit-gradient(linear, left bottom, left top, from(#6b9dca), to(#59cad0));
    background-image: -webkit-linear-gradient(bottom, #6b9dca 0%, #59cad0 100%);
    background-image: -o-linear-gradient(bottom, #6b9dca 0%, #59cad0 100%);
    background-image: linear-gradient(to top, #6b9dca 0%, #59cad0 100%);
    -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.36) inset, 0 2px 3px 0 rgba(73, 73, 73, 0.23);
            box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.36) inset, 0 2px 3px 0 rgba(73, 73, 73, 0.23);
   	width: 290px;
   	margin: 1rem auto;
   	-webkit-transition: 0.2s all ease 0s;
   	-o-transition: 0.2s all ease 0s;
   	transition: 0.2s all ease 0s;
}
.btn-contact a, .btn-media a  {
	display: block;
	width: 100%;
	color: #FFF;
	padding: 2rem 0;
	font-size: 1.8rem;
	font-weight: 400!important;
}
.btn-media {
    text-shadow: 0 -1px 1px rgba(122, 42, 0, 0.63);
    text-align: center;
    border: 1px solid #e58b38;
    border-right-color: #bf7938;
    border-bottom-color: #a76529;
    border-radius: 3px;
    background-color: #ff7200;
    background-image: -webkit-gradient(linear, left bottom, left top, from(#ff7200), to(#f9a72b));
    background-image: -webkit-linear-gradient(bottom, #ff7200 0%, #f9a72b 100%);
    background-image: -o-linear-gradient(bottom, #ff7200 0%, #f9a72b 100%);
    background-image: linear-gradient(to top, #ff7200 0%, #f9a72b 100%);
    -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.36) inset, 0 2px 3px 0 rgba(73, 73, 73, 0.23);
            box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.36) inset, 0 2px 3px 0 rgba(73, 73, 73, 0.23);
   	width: 290px;
   	margin: 3rem auto;
   	-webkit-transition: 0.2s all ease 0s;
   	-o-transition: 0.2s all ease 0s;
   	transition: 0.2s all ease 0s;
}
.btn-contact:hover, .btn-media:hover {
	-webkit-box-shadow: none;
	        box-shadow: none;
    -webkit-transform: translate3d(0, 3px, 0);
            transform: translate3d(0, 3px, 0);
}
.btn-media button {
	font-family: inherit;
}
/* 画面外にいる状態 */
.fadein {
    opacity : 0.0;
    -webkit-transform : translate(0, 50px);
        -ms-transform : translate(0, 50px);
            transform : translate(0, 50px);
    -webkit-transition : all 1000ms;
    -o-transition : all 1000ms;
    transition : all 1000ms;
    }
.delay200 {
	-webkit-transition-delay:200ms;
	     -o-transition-delay:200ms;
	        transition-delay:200ms;
}
.delay400 {
	-webkit-transition-delay:400ms;
	     -o-transition-delay:400ms;
	        transition-delay:400ms;
}
.delay600 {
	-webkit-transition-delay:600ms;
	     -o-transition-delay:600ms;
	        transition-delay:600ms;
}
.delay800 {
	-webkit-transition-delay:800ms;
	     -o-transition-delay:800ms;
	        transition-delay:800ms;
}
/* 画面内に入った状態 */
.fadein.scrollin {
    opacity : 1;
    -webkit-transform : translate(0, 0);
        -ms-transform : translate(0, 0);
            transform : translate(0, 0);
    }

.bnr-recruit {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}
.table-container{
	overflow: auto;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
}
.table-container::-webkit-scrollbar{/*tableにスクロールバーを追加*/
 height: 5px;
}
.table-container::-webkit-scrollbar-track{/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.table-container::-webkit-scrollbar-thumb {/*tableにスクロールバーを追加*/
 background: #BCBCBC;
}
.table-container table{
	width: 100%;
}
sup {
	font-size: 70%; //お好きなサイズに
	vertical-align: top;vertical-align
	position: relative;
	top: -0.1em; //お好きな位置に
}
.btn-wrapper .btn-media,
.btn-wrapper .btn-contact {
	width: 250px;
}
.btn-wrapper .btn-media>*,
.btn-wrapper .btn-contact>* {
	font-size: 16px!important;
 }
/*	header
-------------------------------------------------------------------*/

#btn-contact {
	display: block;
	color: #FFF;
	background: #86BE01;
	width: 5.5rem;
	height: 5.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	font-size: 1.4rem;
	position: fixed;
	right: 60px;
	bottom: 0;
	z-index: 100000;
	border-radius: 2rem;
}
#btn-contact span {
	font-size: 1.2rem;
	letter-spacing: 0;
	display: block;
	line-height: 1;
	padding-top: 5px;
}
#btn-contact:after {
	background: url(../../img/ico-mail.svg) left top no-repeat;
	display: block;
	width: 4rem;
	height: 4rem;
	background-size: contain;
	content :"";
	padding: 2rem;
	position: relative;
}
#btn-tel {
	display: block;
	color: #FFF;
	background: #86BE01;
	font-size: 2.8rem;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 100000;
	border: #FFF 4px double;
	padding: 0 1rem;
	text-align: center;
	line-height: 1.3;
}
#btn-tel span {
	display: block;
	font-size: 1.4rem;
}
#btn-tel:before {
	background: url(../../img/ico-tel.svg) left top no-repeat;
	display: inline-block;
	vertical-align: -5px;
	width: 3rem;
	height: 3rem;
	background-size: contain;
	content :"";
}
header {
	background: #FCD42D;
	display: flex;
	flex-direction: column-reverse;
}
header > div:last-child {
	position: relative;
}
header > div:last-child img:first-child{
	width: 100vw;
	height: 42vh;
	object-fit: cover;
	display: block;
}
header > div:last-child img:nth-child(2){
	position: absolute;
	z-index: 10;
	display: block;
	bottom: 0;
	left: 50%;
	transform: translateY(0) translateX(-45%);
	height: 42vh;
	object-fit: contain;
	object-position: right bottom;
	line-height: 1;
}
header > div:last-child img:last-child {
	position: absolute;
	display: block;
	top: 1rem;
	left: 1rem;
	width: 30%;
}
header h1 {
	font-weight: 900;
  position: relative;
  z-index: 100;
  background: #FFF;
  padding: 1rem 2rem;
  border: #000 3px solid;
  text-align: center;
  font-size: 1.8rem;
}
header h1 span:first-child {
	display: block;
	border-bottom: #707070 1px solid;
	padding-bottom: 0.5em;
}

header h1 span:last-child {
	font-size: 3.6rem;
	display: block;
}
.header__description {
	font-weight: 700;
	margin-block: 1em;
}





/*ドロワーメニューここから*/
.drawer-nav {
	background: #86BE01!important;
}
.drawer-nav h2 {
	margin: 5px;
	font-size: 2rem;
	font-weight: bold;
}
.drawer-menu {
	padding: 2rem!important;
}
.drawer-menu>li {
	padding: 2rem 0;
}
.drawer-menu>li + li {
	border-top: #FFF 1px solid;
}
.drawer-menu>li>ul {
	margin-left: 2rem;
}
.drawer-menu>li>ul>li {
	padding: 1rem 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}
.drawer-menu>li>ul>li::before {
	content: "";
	width: 1em;
	height: 1em;
	display: inline-block;
	background: #0071BC;
	margin-right: 0.5rem;
	vertical-align: middle;
}
.drawer-menu a {
	display: block;
	width: 100%;
	color: #FFF;
}
.drawer-menu>li>ul>li + li {
	border-top: #FFF 1px solid;
}
.drawer-menu .out-link a::after{
	content: "";
	width: 2.4rem;
	height: 2.4rem;
	background: url(../../img/out-link.svg) left center no-repeat;
	display: inline-block;
	vertical-align: -4px;
	background-size: contain;
	margin-left: 0.5rem;
}



.drawer-hamburger-icon,
.drawer-hamburger-icon::before,
.drawer-hamburger-icon::after {
	background-color: #FFF!important;
}
.drawer-open .drawer-hamburger-icon {
	background-color: transparent!important;
}
#drawer-chara {
	color: #FFF;
	font-size: 10px;
	letter-spacing: 0.05em;
}
.drawer-hamburger {
	width: 30px!important;
	height: 30px!important;
	padding-top: 0!important;
	padding-right: 10px!important;
	padding-bottom: 18px!important;
	padding-left: 10px!important;
	border-radius: 2rem;
	background: #86BE01!important;
}





/* breadcrumb
-------------------------------------------------------------------*/
#breadcrumb {
	max-width: 1250px;
	width: 100%;
	margin: 0 auto;
	padding: 25px 0 0;
	color: #aaa;
	font-size: 14px;
}
#breadcrumb li {
	display: inline-block;
	position: relative;
	margin-right: 20px;
}
#breadcrumb li a {
	color: #888;
}
#breadcrumb li a:hover {
	color: #00a89c;
}
#breadcrumb li::after {
	position: absolute;
	right: -25px;
	content: " ＞ ";
}
#breadcrumb li:last-child {
	color: #111;
}
#breadcrumb li:last-child::after {
	display: none;
}
a.anchor{
    display: block;
    padding-top: 20px;
    margin-top: -20px;
}




/* article
-------------------------------------------------------------------*/

/* side
-------------------------------------------------------------------*/










/*	footer
-------------------------------------------------------------------*/
footer {
	background: #2F66CC;
	color: #FFF;
}
footer p small {
	font-size: 0.8em;
}



/*	clearfix
-------------------------------------------------------------------*/

.clear:after {
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	content: " ";
}
.clear {
	display: inline-block;
	min-height: 1%;  /* for IE 7*/
}
/* Hides from IE-mac */
* html .clear {
	height: 1%;
}
.clear {
	display: block;
}
/* End hide from IE-mac */
