@charset "utf-8";

/*************************************************

 全ページ共通のレスポンシブ
 
*************************************************/

@media screen and (max-width: 1420px) {
	img{max-width: 100%;height: auto;width /***/:auto;}
	
	/*index上部の切り替わる画像 slider-pro -------------*/
	.btn-scroll-box {display: none;}
	
	/*/////////////　事業内容 Business　/////////////*/
	.container.indexbusiness{width:96%;}
}




@media screen and (max-width: 1300px) {
	/*index上部の切り替わる画像 slider-pro -------------*/
	/*画像上の文字*/
	ul.headerimgs-text {top: 29%;width: 800px;padding: 60px 50px;}
	ul.headerimgs-text li.headerimgs-text2,
	ul.headerimgs-text li.headerimgs-text3 {font-size:143%;}
}





@media screen and (max-width: 1220px) {
	/*全ページ共通のテーブル構造　-------------------*/
	.container {width:96%;}
}




@media screen and (max-width: 1100px) {
	/*index上部の切り替わる画像 slider-pro -------------*/
	/*画像上の文字*/
	.headerimgs-text-box {border: 15px solid rgba(255,255,255,0.7);}
	ul.headerimgs-text {top: 29%;width: 700px;padding: 40px 40px;}
	ul.headerimgs-text li.headerimgs-text1 {max-width: 570px;}
	ul.headerimgs-text li.headerimgs-text2,
	ul.headerimgs-text li.headerimgs-text3 {font-size:129%;}
	
	/*/////////////　紹介文 About　////////////*/
	.section.indexabout{padding: 130px 0 40px 0;}
	.index-about-midashi {font-size: 55px;}
	.index-about-com{text-align:left;}
	.index-about-com br{display:none;}
}





@media screen and (max-width: 1000px) {
	/*///////　事業内容 Business ////////////*/
	dl.index-business-dl dd .title {font-size: 45px;}

	/*////////　採用情報　Recruit　//////////*/
	.container.indexrecruit .title {font-size: 8vw;}
	ul.indexrecruit-ul {width: 100%;}
	
}






@media screen and (max-width: 920px) {
	/*＝＝＝＝＝ 全ページ共通のheader ＝＝＝＝＝＝＝*/
	#header {height: 60px;padding-top: 0;background-color: rgba(255,255,255,0.9);}
	.header-rogo {width:260px;margin-top:10px;}
	.header-rogo .rogomark {margin-right: 5px;margin-top: 1px;}
	.header-rogo .rogomark img {width: 38px;}
	.header-rogo .rogo {width: 201px;height: 30px;}
	.header-rogo .cap {font-size: 9px;margin-bottom: 4px;}
	
	
	#header.smaller {height: 60px;}
	#header.smaller .header-rogo {margin-top: 10px;}
	#header.smaller .header-rogo .cap {font-size: 9px;}
	#header.smaller .header-rogo .rogo {width: 201px;height: 30px;}
	
	/*全ページ共通のテーブル構造　-------------------*/
	#wrapper {background-size: 1500px;}

	
	/*-------------------------------------------------------------------------
	ページ上部右の出てくるナビmenuが出現して、入れ替わりに横メニューが消える
	--------------------------------------------------------------------------*/
	#header-right {display: none;}


	/*-------------------------------------------------------------------------
	ページ上部右の出てくるナビmenu
	--------------------------------------------------------------------------*/
	.yokomenu-bg{display:none;}
	
	#menubtn{position:absolute;z-index:700;top:0;right:3px;width:70px;height:60px;display:block;cursor:pointer;}
	#menubtn.off{background-color:#fff;}
	#menubtn.on{background-color:#999;}


	/*右側のメニューボタン*/
	.menu-trigger {position:absolute;right: 0;top:17px;z-index:200;width:42px;height:26px;display: inline-block;transition: all .4s;box-sizing: border-box;left: 0;margin: 0 auto;}
	.menu-trigger.active {top: 9px;}
	.menu-trigger span {position: absolute;left: 0;width: 100%;height:2px;background-color:#ff3300;display: inline-block;transition: all .4s;box-sizing: border-box;}
	
	/*
	.menu-trigger::after {position: absolute;left: 0;bottom: -25px;content: 'メニュー';display: block;width: 100%;color: #003540;font-size:79%;font-weight: 600;text-decoration: none;text-align: center;transition: all .4s;white-space: nowrap;letter-spacing: -0.2em;}
	.menu-trigger.active::after {content: '閉じる';color:#fff;bottom: -33px;font-weight: normal;}
	a.menu-trigger{text-decoration:none;}
	*/
	.menu-trigger span:nth-of-type(1) {}
	.menu-trigger span:nth-of-type(2) {top: 50%;left: 50%;-webkit-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);}
	.menu-trigger span:nth-of-type(3) {bottom: 0;}
	
	.menu-trigger.active{top:10px;height:42px;}
	.menu-trigger.active span{height: 2px;background-color: #fff;}
	.menu-trigger.active span:nth-of-type(1) {z-index: 10;-webkit-transform: translateY(20px) rotate(-317deg) scale(1.1);transform: translateY(20px) rotate(-317deg) scale(1.1);}
	.menu-trigger.active span:nth-of-type(2) {display: none;}
	.menu-trigger.active span:nth-of-type(3) {-webkit-transform: translateY(-20px) rotate(317deg) scale(1.1);transform: translateY(-20px) rotate(317deg) scale(1.1);}
	

	/*------------------------------------
	ページ右側から出てくるナビmenu
	------------------------------------*/
	#navi_sp {display: none;position: fixed;max-width: 400px;width:100%;z-index:100;overflow-x: scroll;height:100%;right: 0;top: 0;background-color:#ff3300;}
	#navi_sp a,
	#navi_sp a:hover{text-decoration:none;}

	#navi_sp .menu-trigger.active span {background-color: #000;}

	#navi_sp ul#yoko-menu-sp {text-align: center;list-style: none none outside;background-image: none;margin-top: 40px;}


	ul#yoko-menu-sp li{margin-bottom:22px;}
	ul#yoko-menu-sp li large{font-size:170%;letter-spacing: 0.2em;line-height: 1;font-family: 'Fira Sans Condensed';font-weight: 500;display: block;margin-top: 2px;}
	ul#yoko-menu-sp li a{color:#fff;display: block;font-size: 100%;line-height:1.2;transition: 0.8s;}
	ul#yoko-menu-sp li a:hover{opacity: 0.6;}
	
	ul#yoko-menu-sp li.home{margin-bottom: 10px;}
	ul#yoko-menu-sp li.home a{text-align: center;padding-right: 20%;}

	ul#yoko-menu-sp li.news{border-bottom: 1px dotted #ccc;}
	ul#yoko-menu-sp li.news a{padding: 24px 0 20px 0;}
	ul#yoko-menu-sp li.news a:hover{}
	
	ul#yoko-menu-sp li.big-arrow a{background: url(../images/arrow_more_white23.png) no-repeat left center;padding-left: 30px;}
	ul#yoko-menu-sp li.big-arrow a:hover{padding-left: 35px;background-position: left 5px center;}
	
	ul#yoko-menu-sp li .eng{line-height: 1;font-size: 86%;padding: 0;display: block;}

	ul#yoko-menu-sp li.cooking{}
	ul#yoko-menu-sp li.cooking a{font-size: 72%;margin: 20px 0;}
	ul#yoko-menu-sp li.cooking a:hover{}
	
	ul#yoko-menu-sp li.lodging{}
	ul#yoko-menu-sp li.lodging a{font-size: 72%;margin: 25px 0 20px 0;}
	ul#yoko-menu-sp li.lodging a:hover{}
	
	.lodging-border{border-top: 1px dotted #ccc;margin-top:22px;}
	
	ul#yoko-menu-sp li.lesson{}
	ul#yoko-menu-sp li.lesson a{}
	ul#yoko-menu-sp li.lesson a:hover{}
	
	ul#yoko-menu-sp li.small-arrow a{background: url(../images/arrow_white5-7.png) no-repeat left 17px center;padding-left: 30px;}
	ul#yoko-menu-sp li.small-arrow a:hover{padding-left: 35px;background-position: left 22px center;}


	ul#yoko-menu-sp ul.cookingmenu li a{background: url(../images/arrow_white5-7.png) no-repeat left 17px center;padding-left: 30px;}
	ul#yoko-menu-sp ul.cookingmenu li a:hover{padding-left: 35px;background-position: left 22px center;}


	ul#yoko-menu-sp li.sns{margin: 22px 0 0 35px;}
	ul#yoko-menu-sp li.sns .footer-sns{width: 30px;}
	ul#yoko-menu-sp li.sns .footer-sns:first-child {margin-right: 40px;}
	ul#yoko-menu-sp li.sns .footer-sns img{max-width:100%;height:auto;}

	/*メニューの閉じる*/
	#navi_sp p#menuclose{padding: 0 0 25px 0;margin-top:15px;}
	#navi_sp p#menuclose a{font-size:90%;color:#FFF;padding:11px 15px 11px 0;line-height: 1.0;display: block;background:#444 url(../images/header_menu_close.gif) no-repeat right 15px center;cursor: pointer;width:290px;margin: 0 auto;text-align: center;}
	#navi_sp p#menuclose a:hover{background-color:#666;opacity:1;}


	

	/*上部の大きな固定画像-----------------------*/
	.headerimgs-wrapper {margin-top: 60px;}
	
	/*index上部の切り替わる画像 slider-pro -------------*/
	/*大きさを固定*/
	body.home .sp-mask{height:480px !important;}
	body.home .sp-mask.sp-grab{height:480px !important;}
	body.home .sp-slide,
	body.home .sp-slide.sp-selected,
	body.home .sp-image-container{height: 480px !important;align-items: center;display: flex;justify-content: center;}
	body.home .sp-slide img {max-width: unset !important;width:920px !important;height: 480px !important;margin-left:0 !important;}
	/*画像上の文字*/
	.headerimgs-text-box {border:12px solid rgba(255,255,255,0.7);}
	ul.headerimgs-text {top: 19%;width: 80%;}
	ul.headerimgs-text li.headerimgs-text1 {max-width: 570px;}
	ul.headerimgs-text li.headerimgs-text2,
	ul.headerimgs-text li.headerimgs-text3 {font-size: 2.4vw;}


	/*/////////　採用情報　Recruit　//////////*/
	ul.indexrecruit-ul li {font-size:140%;}	
	dl.indexrecruit-dl{text-align:center;margin-top:30px;}
	dl.indexrecruit-dl dt{display:block;}
	dl.indexrecruit-dl dd{display:block;}
	
	/*/////////// 全ページ共通のフッター  ///////////////////*/
	dl.footer-dl dt{display:block;margin-right:0;margin-bottom: 15px;}
	#footer .header-rogo .rogomark img{width: 46px;}
}





@media screen and (max-width: 850px) {
	/*lozad.jによるアニメーション------*/
	.fadein-			{opacity: 1;transition:none;}
	.fadein-left	{opacity: 1;transform:none;transition:none;}
	.fadein-right	{opacity: 1;transform:none;transition:none;}
	.fadein-up		{opacity: 1;transform:none;transition:none;}
	.transition-delay{transition-delay:0s;}
	
	
	/*/////////////　紹介文 About　////////////*/
	.section.indexabout {padding: 100px 0 0px 0;}
	.index-about-midashi {font-size: 6.5vw;}
	.index-about-com {font-size: 129%;}
	.container.indexabout .naka-kuwashii a {background-size: 35px;min-width: 370px;font-size: 140%;}
	.container.indexabout .naka-kuwashii a:hover{background-size: 35px;}
	
	/*/////////　採用情報　Recruit　//////////*/
	.container.indexrecruit .cap {width: 97%;font-size: 159%;}
	ul.indexrecruit-ul{text-align:center;}
	ul.indexrecruit-ul li {font-size: 129%;width: 31%;margin: 0 0.5% 12px 1%;}
	.container.indexrecruit .naka-kuwashii a {font-size: 136%;}
}





@media screen and (max-width: 780px) {
	/*///////　事業内容 Business ////////////*/
	dl.index-business-dl{font-size: 90%;}
	dl.index-business-dl dd .title {font-size: 40px;text-indent: 0.4em;}
	dl.index-business-dl dd .cap {font-size: 130%;}
}






@media screen and (max-width: 700px) {
	/*==========　お問合せ   toiawase/  ==========*/
	#toiawase-form dt.title {width: 100%;float: none;padding: 13px 0 3px 42px;line-height: 1;height: 35px;}
	#toiawase-form dt.title.need 		{background: url(../img/toiawase_hitu.png) no-repeat left 2px top 12px;}
	#toiawase-form dt.title.unneed 	{background: url(../img/toiawase_nin.png) no-repeat left 2px top 12px;}	
	#toiawase-form dl dd {padding:5px 0 15px 5px;}
	.form-submit input {width:60%;}
	/*.form-submit input.reset {width:24%;margin-left: 5%;}	*/	
	/* 内容確認用のスタイル----*/
	#toiawase-form.kakunin dd {padding: 5px 0px 9px 20px;}
	/*完了ページ*/
	.kanryou-waku {padding:0;}
	.kanryou-waku .form-kanryo1 {font-size: 115%;margin-bottom: 20px;}
	.kanryou-waku .form-kanryo2{text-align: left;}
	.kanryou-waku .form-kanryo2 span {display: inline;}
}






@media screen and (max-width: 640px) {
	/*全ページ共通のテーブル構造　-------------------*/
	.container {width:93%;}
	
	/*index上部の切り替わる画像 slider-pro -------------*/
	/*画像上の文字*/
	.headerimgs-text-box {border:10px solid rgba(255,255,255,0.7);}
	ul.headerimgs-text {top: 15%;padding: 35px 30px 40px 30px;}
	ul.headerimgs-text li.headerimgs-text2 {font-size: 122%;}
	ul.headerimgs-text li.headerimgs-text3 {font-size: 115%;}
	ul.headerimgs-text li.headerimgs-text2 span{display:block;margin-top: 5px;}
	ul.headerimgs-text li.headerimgs-text3 br{display:none;}

	/*全ページ共通のテーブル構造　-------------------*/
	#wrapper {background-size: 1000px;}

/*------------ 動画 -----------*/
/*先方担当者がUPするyoutubeの動画レスポンシブ*/
.responsive-video{margin: -20px auto 50px auto;}
	
	/*///////　事業内容 Business ////////////*/
	dl.index-business-dl {display: block;}
	dl.index-business-dl .left {float: none;}
	dl.index-business-dl dt {width: 100%;height: auto;}
	dl.index-business-dl dt a {height: 0;padding-top: 70%;background-size: cover;}
	dl.index-business-dl .right {float: none;}
	dl.index-business-dl dd {width: 100%;height: auto;padding: 40px 5% 60px 5%;}
  dl.index-business-dl dd .naka-kuwashii a {background-position:left -14px center;background-size: 30px;}
  dl.index-business-dl dd .naka-kuwashii a:hover {background-position:left -19px center;}
	
	/*/////////　採用情報　Recruit　//////////*/
	.section.bg-recruit {background-size: cover;}
	.container.indexrecruit .cap {font-size: 4.3vw;}
	ul.indexrecruit-ul li {width: 80%;margin: 0 auto 12px auto;display: block;padding: 27px 10px;}
	ul.indexrecruit-ul li br{display:none;}
	
	/*全ページ共通のページ下部の上部へ戻る */
	#pagetop a {bottom: 10px;right: 10px;width: 50px;height: 50px;}
}






@media screen and (max-width: 540px) {
	/*index上部の切り替わる画像 slider-pro -------------*/
	/*大きさを固定*/
	body.home .sp-mask{height:420px !important;}
	body.home .sp-mask.sp-grab{height:420px !important;}
	body.home .sp-slide,
	body.home .sp-slide.sp-selected,
	body.home .sp-image-container{height: 420px !important;align-items: center;display: flex;justify-content: center;}
	body.home .sp-slide img {max-width: unset !important;width:780px !important;height: 420px !important;margin-left:0 !important;}
	/*画像上の文字*/
	.headerimgs-text-box {border:10px solid rgba(255,255,255,0.7);}
	ul.headerimgs-text {top: 15%;padding: 35px 30px 40px 30px;width: 85%;}
	ul.headerimgs-text li.headerimgs-text2 {font-size: 3.6vw;margin: 15px auto 12px auto;}
	ul.headerimgs-text li.headerimgs-text3 {font-size: 3.2vw;}
	
	/*/////////////　紹介文 About　////////////*/
	.section.indexabout {padding: 70px 0 0px 0;}
	.index-about-com {font-size: 115%;}
	.container.indexabout .naka-kuwashii {margin-top: 30px;}
	.container.indexabout .naka-kuwashii a {min-width: auto;font-size: 130%;width: 75%;}
	
	/*///////　事業内容 Business ////////////*/
	dl.index-business-dl dd .naka-kuwashii a {width: 75%;}


	/*==========　お問合せ   toiawase/  ==========*/
	.toiawase-tel-cap {font-size: 71%;letter-spacing: 1em;}
	.toiawase-tel a {font-size: 38px;background-size: 30px;padding-left: 34px;}  
	#chuui-waku {width: 100%;padding: 13px 10px 7px 10px;margin:30px auto 0 auto;}
	#toiawase-form {width: 100%;}
	.form-submit input {width: 80%;}
	.form-submit input.reset {margin-left: 0;margin-top: 15px;}
	/* 内容確認用のスタイル*/
	.form-kakunin2 {font-size: 100%;}
	/*エラー表示*/
	.errorBox {font-size: 86%;}
	.errorBox .errorTitle {font-size: 100%;padding: 4px 2px 2px 10px;text-align: left;}
	
	
	/*/////////// 全ページ共通のフッター  ///////////////////*/
	ul.footer-menu-ul {display: none;}
	.footer-tel a {font-size: 36px;background-size: 27px;padding-left: 32px;}
	dl.footer-dl dd .naka-kuwashii a {width: 290px;font-size: 115%;letter-spacing: 0.2em; background-position: left -10px center;background-size: 22px;}
	.footer-tel-cap {font-size: 60%;letter-spacing: 1.2em;}	
}






@media screen and (max-width: 450px) {
	/*index上部の切り替わる画像 slider-pro -------------*/
	/*画像上の文字*/
	ul.headerimgs-text {padding: 35px 20px 35px 20px;}
	ul.headerimgs-text li.headerimgs-text2 {font-size: 4vw;}
	ul.headerimgs-text li.headerimgs-text3 {font-size: 3.8vw;}

	/*/////////　採用情報　Recruit　//////////*/
	.container.indexrecruit .naka-kuwashii a{width: 100%;font-size: 120%;}
	ul.indexrecruit-ul li {width: 90%;padding: 22px 10px;font-size: 115%;}
}




@media screen and (max-width: 390px) {
	/*/////////////　紹介文 About　////////////*/
	.index-about-com {font-size: 109%;}
	.container.indexabout .naka-kuwashii a {background-size: 25px;font-size: 120%;background-position: left -12px center;}
	.container.indexabout .naka-kuwashii a:hover {background-size: 25px;background-position: left -7px center;}
	
	/*///////　事業内容 Business ////////////*/
	dl.index-business-dl dd .title {font-size: 36px;}
	dl.index-business-dl dd .naka-kuwashii {margin-top: 20px;}
	.naka-kuwashii a {font-size: 122%;}

	/*==========　お問合せ   toiawase/  ==========*/
	.toiawase-tel-cap {font-size: 64%;}
	.toiawase-tel a {font-size: 34px;background-size: 26px;padding-left: 30px;}  
	/*完了ページ*/
	.kanryou-waku .form-kanryo1 {font-size:108%;}
	.kanryou-waku .form-kanryo3 .naka-kuwashii a {width: 260px;font-size: 108%;}

	/*/////////// 全ページ共通のフッター  ///////////////////*/
	dl.footer-dl {font-size: 90%;}
	dl.footer-dl dt .rogo-cap {font-size: 80%;}
	dl.footer-dl dt .header-rogo {width: 285px;}
	dl.footer-dl dt .header-rogo .cap {font-size: 10px;}
	dl.footer-dl dt .header-rogo .rogo {width: 230px;}
	#footer .header-rogo .rogomark img {width: 40px;margin-right: 3px;}
	.footer-zip span {display: block;margin-right: -0.7em;}
	.copyright {font-size: 55%;}
}




