@charset "utf-8";

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

				スマホのみ

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

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

	.pc {
		display: none !important;
	}

	.sp {
		display: block;
	}

	.sp_box {
		display: flex;
		margin-bottom: 1em;
	}

	.sp_box p {
		text-align: left !important;
	}

	.sp_box1-1 {
		width: 58%;
		margin-right: 2%;
	}

	.sp_box1-2 {
		width: 40%;
	}

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

				共通

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

	.container {
		width: 100%;
	}

	.container2 {
		width: 100%;
	}

	.box {
		display: block;
		justify-content: space-between;
	}

	.box1-1 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.box1-2 {
		width: 100%;
	}

	.box2-1 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.box2-2 {
		width: 100%;
	}

	.box3-1 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.box3-2 {
		width: 100%;
	}

	.box4-1 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.box4-2 {
		width: 100%;
	}

	.box5-1 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.box5-2 {
		width: 100%;
	}

	.box_left {
		width: 100%;
	}

	.box_right {
		width: 100%;
	}

	.box_left2 {
		width: 100%;
	}

	.box_right2 {
		width: 100%;
	}

	.box_left3 {
		width: 100%;
	}

	.box_right3 {
		width: 100%;
	}

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

				ヘッダー

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


	h1.logo {
		width: 50%;
	}

	.header_menu {
		width: auto;
	}

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

			グローバルメニュー

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

	.drawer-nav {
		width: 80% !important;
	}

	.header_container {
		width: 100%;
	}

	.header_menu ul.colum2 {
		display: none;
	}

	.header_menu .contact {
		display: none;
	}

	ul.header_colum2 li.yoyaku a {
		font-size: 16px;
	}

	p.sp_mail_link a {
		font-size: 16px;
	}

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

			メインビジュアル

**************************************/
	#visual {
		margin-top: 0;
	}

	#visual .swiper-slide {
		height: 430px;
	}

	p#visual_logo {
		top: 55%;
	}

	p#visual_logo img {
		width: 120px;
		height: auto;
	}

	#visual #slide01 {
		background: url("/images/sp_slide01.jpg") no-repeat;
		background-position: right center;
	}

	#visual #slide02 {
		background: url("/images/sp_slide02.jpg") no-repeat;
		background-position: center center;
	}

	#visual #slide03 {
		background: url("/images/sp_slide03.jpg") no-repeat;
		background-position: right center;
	}

	#visual #slide04 {
		background: url("/images/sp_slide04.jpg") no-repeat;
		background-position: right center;
	}

	#visual #slide05 {
		background: url("/images/sp_slide05.jpg") no-repeat;
		background-position: center center;
	}

	#visual #slide07 {
		background: url("/images/sp_slide07.jpg") no-repeat;
		background-position: center center;
	}

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

				コロナ対策

**************************************/
	#important {
		padding: 10px;
	}

	.important_text {
		display: block;
		width: 100%;
		padding: 5px 10px !important;
	}

	.important_text img.photo {
		display: none;
	}

	.important_text p.title {
		font-size: 16px !important;
		margin-bottom: 10px;
		text-align: left;
	}

	.important_text p {
		font-size: 14px;
	}

	.important_text .contact {
		width: 100%;
		margin: 0 !important;
	}

	.important_text .colum3 {
		display: block;
	}

	.important_text .colum3_col {
		width: 100%;
		margin-right: 0;
	}

	.important_text .colum3 .long {
		width: 100%;
		margin-top: 1em;
	}

	p.btn {
		position: static !important;
		margin-top: 10px;
	}

	p.btn img {
		display: block;
		width: 40px;
		margin: auto;
	}

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

				多言語

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

	#langage_box {
		display: none;
	}

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

				トップページ

**************************************/
	.section01 .photo {
		width: 80%;
		margin: 0 auto;
	}


	article .comment p {
		font-size: 15px !important;
	}

	article p.midashi2 {
		font-size: 21px !important;
	}

	.section01 {
		padding: 60px 20px;
	}

	.section01 p {
		font-size: 98%;
	}

	.section01:after {
		content: url("/images/sp_logo.png") !important;
	}

	.section01 .box1-1 {
		display: flex;
	}

	/* お食事 */
	.section02 .meal_img {
		height: 280px;
		min-height: 280px;
	}

	.section02 .contents {
		width: 100%;
		padding: 20px 20px 20px 10px;
	}

	.section02 .comment {
		width: 87%;
	}

	.section02 .box {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.section02 .box_left {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
	}

	.section02 .box_right {
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
	}

	.section02 p.midashi:after {
		top: -82px;
	}

	/* 温　泉 */
	.section03 .onsen_img {
		height: 280px;
		min-height: 280px;
	}

	.section03 .contents {
		width: 100%;
		padding: 20px 20px 20px 10px;
		margin: 0 0 0 auto;
	}

	.section03 .comment {
		width: 87%;
	}

	.section03 p.midashi:after {
		top: -82px;
	}

	/* お部屋 */
	.section04 .room_img {
		height: 280px;
		min-height: 280px;
		background-position: center center;
	}

	.section04 .contents {
		width: 100%;
		padding: 20px 20px 20px 10px;
	}

	.section04 .comment {
		width: 87%;
	}

	.section04 .box {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.section04 .box_left {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
	}

	.section04 .box_right {
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
	}

	.section04 p.midashi:after {
		top: -82px;
	}

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

			Instagram/お知らせ

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

	.instagram {
		width: 100%;
	}

	.instagram ul {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.instagram ul li {
		width: 48%;
		margin-right: 2%;
		margin-bottom: 30px;
	}

	.instagram ul li:nth-child(even) {
		margin-right: 0;
	}

	.instagram ul li span.time {
		display: block;
		font-size: 13px;
		color: #ffffff;
		padding: 5px 0;
		text-align: left;
	}

	.instagram ul li p.comment {
		display: block;
		margin-top: 8px;
		line-height: 1.6;
		font-size: 13px;
		color: #ffffff;
	}

	.instagram img {
		height: 160px;
	}

	#news {
		box-sizing: border-*box;
	}

	#news h2 {
		width: 100%;
		font-size: 30px;
	}

	#news p.instagram_detail a {
		width: 100%;
		font-size: 16px;
	}

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

				アクセス

**************************************/
	p.detail_btn a {
		width: 100%;
		font-size: 16px;
	}

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

				フッター

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

	.footer_container {
		width: 100%;
		padding: 15px;
		box-sizing: border-box;
	}

	.contact_box {
		display: block;
		align-items: center;
	}


	.contact_box1-1 {
		display: block;
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
		padding: 0 10px 20px 10px;
		border-right: none;
		border-bottom: 1px solid #000;
	}

	.contact_box1-2 {
		display: block;
		width: 100%;
	}

	.contact_box1-2 p.mail {
		display: block;
		font-size: 16px;
		padding-bottom: 10px;
		text-align: center;
	}

	.contact_box1-2 p.link_btn a {
		font-size: 18px;
		padding: 15px;
	}

	.footer_box {
		display: block;
		padding: 1em 0 2em 0;
	}

	ul.footer_menu {
		display: none;
	}

	.footer_left_box {
		width: 100%;
		margin-right: 0;
	}

	.footer_right_box {
		display: none;
	}

	p.tel {
		padding: 0;
	}

	p.tel span a {
		font-size: 28px;
	}

	.footer_description p {
		font-size: 14px;
	}

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

				次階層

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

	.next_header {
		height: 300px;
	}

	.next_header img {
		top: 60px;
		width: 60px;
	}

	#next_main h2 {
		font-size: 21px;
	}

	#next_section {
		margin-top: 20px;
		padding: 40px 20px;
	}

	#next_section p.copy {
		font-size: 16px;
	}

	.pankuzu {
		margin-bottom: 0;
	}

	#next_section ul.colum3 {
		display: block;
	}

	#next_section ul.colum3 li {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	#next_section ul.colum3 li:last-child {
		margin-bottom: 0;
	}

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

				お食事

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

	#meal_article {
		margin-top: 30px;
	}

	.meal_section .contents {
		flex-wrap: wrap;
	}

	.meal_section .contents:before {
		display: none;
	}


	.meal_section .title:after {
		display: none;
	}

	.meal_section .title {
		width: 100%;
		margin-top: 1em;
		padding: 0;
	}

	.meal_section .comment {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		padding: 0;
		text-align: left;
	}

	.meal_section .comment p {
		width: 100%;
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		writing-mode: initial;
		height: auto;
		margin: 0;
		font-size: 16px;
	}

	.meal_section p.midashi2 {
		width: 100%;
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
		font-size: 25px;
	}

	.meal_section p.img img {
		width: 100%;
	}

	.meal_section .title .onsen_copy img {
		width: 100%;
	}

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

				各種プラン

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

	/* ステーキプラン */
	#meal_article .plan0 {
		height: 350px !important;
	}

	/* マル得プラン */
	#meal_article .plan01 {
		height: 350px !important;
	}

	/* ヒラメプラン */
	#meal_article .plan02 {
		height: 350px !important;
	}

	/* 味覚プラン */
	#meal_article .plan03 {
		height: 350px !important;
	}

	/* 伊勢海老プラン */
	#meal_article .plan04 {
		height: 350px !important;
	}

	/* 海鮮プラン */
	#meal_article .plan05 {
		height: 350px !important;
	}


	.meal_section01 {
		margin-bottom: 80px;
	}

	.meal_section02 {
		margin-bottom: 80px;
	}

	#meal_article .meal_section01 .contents p#midashi {
		padding-left: 30px;
	}

	#meal_article .meal_section02 .contents p#midashi {
		padding-left: 30px;
	}

	#meal_article .meal_section01 .comment {
		padding: 0 30px;
	}

	#meal_article .meal_section02 .comment {
		padding: 0 30px;
	}

	#meal_article .meal_section01 .comment:after {
		height: 450px;
		left: 20px;
	}

	#meal_article .meal_section02 .comment:after {
		height: 450px;
		left: 20px;
	}

	.meal_section02 .box {
		display: flex;
		flex-wrap: wrap;
	}

	.meal_section02 .box_left3 {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
	}

	.meal_section02 .box_right3 {
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
	}


	.plan01_box {
		min-height: auto;
		height: auto;
		padding-top: 10px;
	}

	.plan02_box {
		min-height: auto;
		height: auto;
		padding-top: 10px;
	}

	#meal_article .meal_section01 .contents {
		width: 100%;
	}

	#meal_article .meal_section02 .contents {
		width: 100%;
	}

	#meal_article .meal_section01 .comment ul {
		padding-left: 0;
		margin-left: 2em;
	}

	#meal_article .meal_section02 .comment ul {
		padding-left: 0;
		margin-left: 2em;
	}

	#meal_article .meal_section01 .comment ul li {
		font-size: 12px;
	}

	#meal_article .meal_section02 .comment ul li {
		font-size: 12px;
	}


	/* 朝食 */
	#breakfast {
		padding: 30px;
	}

	#breakfast .contents p#midashi {
		padding-left: 0;
	}

	#breakfast .comment {
		padding-left: 0;
	}

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

				温泉

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

	p.time_text {
		padding-bottom: 0;
	}

	#google360 {
		max-width: 100%;
		width: 100%;
		margin: 0 auto 40px auto;
		border-radius: 10px 10px 0 0;
	}

	#google360 span {
		display: block;
		width: 100%;
		margin: 0 auto;
		margin-bottom: 10px;
		padding: 0;
		box-sizing: border-box;
		font-size: 15px;
		font-weight: normal;
		color: #ffffff;
		border: none;
		border-radius: 0;
		text-align: center;
		position: static;
	}

	#google360 iframe {
		width: 100%;
		height: 300px;
	}

	#next_section ul.colum2 {
		display: block;
		margin-bottom: 40px;
	}

	#next_section ul.colum2 li {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}

	#next_section ul.colum2 li:last-child {
		margin-bottom: 0;
	}

	.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
		margin: 0 5px !important;
	}

	.swiper-pagination-bullet {
		width: 10px !important;
		height: 10px !important;
	}

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

				お部屋

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

	.room_section {
		padding: 20px;
	}

	.facility_box {
		display: block;
		width: 100%;
	}

	.facility_box .photo {
		width: 100%;
	}

	.facility_box .facility_section {
		width: 100%;
		padding: 20px;
	}

	#google360_2 {
		max-width: 100%;
		width: 100%;
		margin: 40px auto;
		border-radius: 10px 10px 0 0;
	}

	#google360_2 span {
		display: block;
		width: 100%;
		margin: 0 auto;
		margin-bottom: 10px;
		padding: 0;
		box-sizing: border-box;
		font-size: 15px;
		font-weight: normal;
		color: #ffffff;
		border: none;
		border-radius: 0;
		text-align: center;
		position: static;
	}

	#google360_2 iframe {
		width: 100%;
		height: 300px;
	}

	.room_section .price_box {
		padding: 10px;
	}

	.room_section .price_box p {
		font-size: 20px;
	}

	.room_section p {
		line-height: 1.8;
	}

	.room_section p.title {
		font-size: 18px;
	}

	.fireworks {
		display: none;
	}

	.room_colum2 {
		flex-wrap: wrap;
	}

	.room_colum2_col {
		width: 100% !important;
		margin-right: 0;
	}

	.room_colum2_col:first-child {
		margin-bottom: 20px;
	}

	#r_img {
		position: static;
	}

	p.right_img {
		margin-top: 10px;
		max-width: 100%;
		position: static;
		text-align: center;
	}

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

				周辺観光

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

	#spot_section {
		min-height: auto;
	}

	#spot_section .comment {
		display: block;
		padding: 0;
		text-align: left;
	}

	#spot_section .comment img {
		display: block;
		width: 100%;
		margin: 0 auto;
	}

	img.spot_img {
		position: static;
	}

	.z-index {
		width: 100%;
	}

	#spot h4 {
		width: 95%;
		margin: 0 auto 1em auto;
	}

	ul.spot {
		display: block;
		width: 100%;
	}

	ul.spot li {
		width: 100% !important;
		margin-right: 0;
		margin-bottom: 20px;
	}

	ul.spot li:last-child {
		margin-bottom: 0;
	}

	#bunner_area ul {
		width: 100%;
	}

	#bunner_area ul li {
		width: 48%;
	}

	#bunner_area ul li:nth-child(even) {
		margin-right: 0;
	}

	#bunner_area ul li.mb_none {
		margin-bottom: 25px;
	}

	#bunner_area ul li:nth-child(7) {
		margin-bottom: 0;
	}

	#bunner_area ul li:last-child {
		margin-bottom: 0;
	}

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

				交通アクセス

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

	.access_section {
		padding: 20px !important;
	}

	.access_detail {
		padding: 0;
	}

	.access_detail img {
		display: block;
		width: 100%;
		margin: 0 auto;
	}

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

				よくある質問

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

	#question_body .meal_section .comment {
		display: block;
		padding: 0;
		text-align: center;
	}

	#question_body #next_section {
		padding: 40px 20px;
	}

	#section_menu ul li {
		width: 100%;
		margin-right: 0;
	}

	.question_section p.q {
		font-size: 16px !important;
	}

	.question_section .a p {
		font-size: 14px;
	}

	#other_link {
		margin-bottom: 0;
	}

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

			プライバシーポリシー

*************************************/
	.privacy_section {
		width: 100%;
		padding: 20px;
	}

	.privacy_section h4 {
		font-size: 18px;
	}

	.privacy_section p {
		font-size: 14px;
	}

	.privacy_section ul li {
		font-size: 14px;
	}


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

			お問い合わせ

*************************************/
	.contact_txt {
		margin: 0 20px;
		padding: 10px;
		box-sizing: border-box;
	}

	.contact_txt .box_text {
		padding: 3% 5%;
		float: none;
		width: 100%;
		border-bottom: 1px solid #000;
	}

	.contact_txt .box_contact {
		float: none;
		width: 100%;
	}

	.contact_txt .box_text:after {
		display: none;
	}

	.contact_txt .box_contact .title_tel {
		font-size: 100%;
	}

	.contact_txt .box_contact dl dt {
		font-size: 140%;
	}

	.text_tel a {
		font-size: 200%;
	}

	.contact_flow ul li {
		font-size: 85%;
		padding: 15px 5px;
	}

	table.contact_table th {
		width: 35%;
		font-size: 14px;
	}

	table.contact_table td {
		width: 65%;
	}

	.tel_btn p.number span {
		display: block;
		margin-left: 0;
	}

}

/* スマホ */

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

				スマホ以外

*************************************/
@media screen and (min-width: 640px) {

	.pc {
		display: block;
	}

	.sp {
		display: none !important;
	}

	#langage_box {
		width: 70px;
		background-color: #fff;
		padding: 40px 10px;
		border-radius: 5px 0 0 5px;
		position: fixed;
		right: 0;
		top: 100px;
		z-index: 999;
		box-shadow: -2px 2px 10px rgba(0, 0, 0, 0.4);
	}

	#langage_box ul {
		display: block;
	}

	#langage_box ul li {
		display: block;
		width: 100%;
		margin-bottom: 20px;
		text-align: center;
	}

	#langage_box ul li:last-child {
		margin-bottom: 0;
	}

	.drawer-nav ul li {
		width: 100%;
	}

}

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

				PCのみ

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

@media screen and (min-width: 1300px) {

	.pc {
		display: block;
	}

	.tb {
		display: none !important;
	}

	.sp {
		display: none !important;
	}

}

/* PC */


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

				タブレット

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

@media screen and (min-width: 640px) and (max-width: 1400px) {
	p.tel span a {
		font-size: 26px;
	}

	.header_menu {
		width: 79%;
	}

	nav {
		width: 57%;
	}

	nav ul li {
		width: 16%;
	}

	nav ul li a {
		padding: 5px 8px;
	}

	.long {
		width: 20%;
	}

	.long2 {
		width: 25%;
	}

	.contact_box1-1 {
		width: 65%;
	}

	.contact_box1-2 {
		width: 35%;
	}

}