@charset "UTF-8";
@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700&display=swap&subset=japanese');
/* CSS Document */


/* 
======================================================================
reset
====================================================================== */
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,p,blockquote,th,td,article,section,aside,header,nav{
	margin:0;
	padding:0;
    box-sizing: border-box;
}

li{
	list-style-type:none;
}

p{
	margin:0;
	padding:0;
}

/* 
======================================================================
common
====================================================================== */
body {
	color: rgb(17, 17, 17);
	font-size: 14px;
	font-family: 'Noto Sans JP', sans-serif;
	line-height: 1.5;
}
a, a:visited {
    color: #00709E;
    text-decoration: underline;
    -webkit-transition: all .2s;
    transition: all .2s;
}
a:hover { text-decoration: none; }

a img {
	transition: 0.3s ease-in-out;
}

a img:hover {
	opacity: 0.7;
}

button {transition: .3s; }

input {transition: .3s; }

hover {transition: .3s; }


h1 { font-size: 2.5em; }
h1 .floor_num{
	font-size: 18px;
	border: solid 1px;
    padding: 0 5px;
    margin-right: 10px;
	vertical-align:middle;
}
h1 .explain{
	font-size: 16px;
}
.h1_bg {
	background-color: #f0f0f0;
	padding: 0 3.2%;
	margin: 0 -3.2% 20px;
}
.h1_bg h1{
	width: 100%;
    max-width: 1000px; 
	margin: 0 auto;
	padding: 1em 0;
	font-weight: 400;
}
.two_lines h1{
	padding: 0.8em 0;
}
h2 {
    font-size: 1.7em;
	border-left : solid 8px #00709E;
	margin: 24px 0;
	padding : 0 0.5em ;
	font-weight: 500;
}
h3 { font-size: 1.5em; }
h4 { font-size: 1.2em; }

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

.for-sp{display: none;}
.for-pc{display: block;}

.wrapper{
	position: relative;
    margin: 0 3%;
}
.screen-ajust {
    width: 100%;
    max-width: 1000px;
	margin: 0 auto;
}
.screen-margin-pc {
    margin: 0 -3.2%;
    padding: 0 3.2%;
}
.main {
    width: 100%;
    max-width: 1000px;
	margin: 0 auto;
}
.main-caption h2{
	font-size: 16px;
	margin: 0 0 25px;
	border: 0;
}
.p18{
	font-size: 18px;
}
.p16{
	font-size: 16px;
}
.p14{
	font-size: 14px;
}
.p12{
	font-size: 12px;
}
.title{
	font-weight: 600;
}
.thin{
	font-weight: 400;
}
.attention{
	color:#c30000;
}
.text-indent {
    padding-left: 1em;
    text-indent: -1em;
    margin-top: 0.3em;
}


/* パンくず */
.pankuzu_bg {
	background-color: #f0f0f0;
	border-bottom: solid 1px;
    border-color: #a5a5a5;
    margin: 0 -3.2%;
    padding: 0 3.2%;
}
.pankuzu {
	width: 100%;
    max-width: 1000px; 
	margin: 0 auto;
	padding: 0.6em 0;}
.pankuzu ul, .st_view ul, .room_gaiyo ul {
	display: flex;
	margin: 0;
	padding: 0;
}
.pankuzu ul li {margin-right: 8px;}
/* パンくず end */


/* ストリートビュー */
.st_view ul li:first-child {margin: 0 10px 0 0;}
/*.st_view p{    margin: 8px 0 20px 0;}*/

ul.st-view-3column{
	max-width: 1000px;
	margin: 10px auto 0;
}
.st-view-3column li{
	width: 33%;
	margin: 0 10px;
}
.st-view-3column li .p14{
	margin: 0 0 2px;
}
.st-view-3column li:last-child{
	margin: 0 0 0 10px;
}

/* ストリートビュー end */


/* お問い合わせ番号 BOX */
.info_box{
	text-align: center;
    background-color: rgba(17, 103, 143, 0.1);
	padding: 15px;
}
.info_box h3{
	margin: 0 0 5px;
}
.info_box ul{
	justify-content: center;
}
.info_box ul li{
	margin: 0 10px 10px;
    font-size: 255%;
    font-weight: 500;
    color: #00709E;
	/* 191018 アクセスのインフォボックスが横並びならなかったため追加 宮下 */
	display: inline-block;
}
/* お問い合わせ番号 BOX end */


.st_view, .room_gaiyo, .room_detail, .inq-telfax, .inq-form  {padding: 0 0.25em;}
.st_view ul li img{width: 100%;}
.room_gaiyo, .room_detail, .inq-telfax {margin: 0 0 45px;}
/*.room_gaiyo p, .room_detail p{margin: 0 0 10px;}*/
.table-room-detail {margin: 0 0 20px;}
.attention{color: #c30000}
.attention p{
	text-align: left;
	margin: 0 0 25px;
}


/* お読みください */ /* トップページ告知 */
.read_box{
    background-color: rgba(195, 0, 0, 0.1);
    padding: 0 4% 4%;
    font-size: 90%;
}
.read_box > div + div {
	margin-top: 1.5em;
}
.read_box h3{
    text-align: center;
    color: #fff;
    background: #a44444;
    padding: 0.2em;
    margin: 0 -4.3% 1em;
}
.read_box h4{
    margin-bottom: 0.3em;
}
.read_box p{margin: 0 0 10px;}
.read_box ul{margin-bottom: 20px;}
.read_box ul:last-child{margin: 0;}
.read_box ul li ul li{margin-left: 1em;}
.read_box li {
    margin-bottom: 0.3em;
}

.announcement{
    margin-bottom: 35px;
}
.announcement h3{
    text-align: center;
    color: #a44444;
    background: #f9e5e5;
    padding: 0.5em;
    margin: 0 0 1em;
	font-size: 20px;
	font-weight: 500;
}
@media screen and (max-width: 768px) {
	.announcement h3{
		font-size: 16px;
		padding: 0.8em;
	}
}
.announcement .announcement_link{
	text-align: center;
    font-weight: bold;
	margin-top: 1em;
}
/* お読みください end */ /* トップページ告知 end */


/* 区切りで横線を使用したいとき */
hr {
	border-width: 1px 0px 0px 0px; /* 太さ */
	border-style: solid; /* 線種 */
	border-color: #a5a5a5;   /* 線色 */
	margin: 0;
	margin: 20px 0;
}
/* 区切りで横線を使用したいとき end */


/* お急ぎの方はお電話にてお願いします！ */
.oisogi_box{
	border: solid 2px #C30000;
	padding: 15px;
	margin: 40px 0;
	text-align: center;
}

.oisogi_box h3{
	color: #c30000;
	margin-bottom: 0.5em;
}

.oisogi_box p{
	margin: 0 0 10px;
}
/* お急ぎの方はお電話にてお願いします！ end */


/* ボタン ホバー用
margin-bottom:20px → .btn-hover
margin-bottom:40px → .btn-hover-last
btn-hover-h2 → h2の中に入れるとき使用
*/
.btn-hover {
	background-color: #00709E;
  	border: 1.5px solid #00709E;
  	color: #fff;
	padding: 15px 0;
	width: 100%;
	font-size: 120%;
	margin-bottom: 20px;
	cursor: pointer;
}

.btn-hover-last {
	background-color: #00709E;
  	border: 1.5px solid #00709E;
  	color: #fff;
	padding: 15px 0;
	width: 100%;
	font-size: 120%;
	margin-bottom: 40px;
}

.btn-hover:hover {
  	background-color: #fff;
  	border-color: #00709E;
  	color: #00709E;
}

.btn-hover-last:hover {
  	background-color: #fff;
  	border-color: #00709E;
  	color: #00709E;
}

a.btn-hover{
	color: #fff;
    text-decoration: none;
}

a.btn-hover:hover{
	color: #00709E;
}

a.btn-hover-last{
	color: #fff;
    text-decoration: none;
}
a.btn-hover-last:hover{
	color: #00709E;
}

.btn-hover-h2 {
	background-color: #00709E;
  	border: 1.5px solid #00709E;
  	color: #fff;
	width: auto;
	font-size: 90%;
	padding: 5px 1em;
	margin: 26px 0.5em 0;
	position: absolute;
	cursor:pointer;
}

.btn-hover-h2-mhall {
	background-color: #00709E;
  	border: 1.5px solid #00709E;
  	color: #fff;
	width: auto;
	font-size: 90%;
	padding: 5px 1em;
	margin: 26px 0.5em 0;
	position: static;
	cursor:pointer;
}

/* 座席表やレイアウトなどミニサイズ用 */
.btn-hover-mini {
	margin-top: 8px;
    padding: 5px 1em;
    width: auto;
    font-size: 95%;
}
.g-slide .btn-hover-mini{
	width: 30%;
    margin: 0 4.5% 0 0;
}
.g-slide .btn-hover-mini.btn-end{margin: 0;}


/* ボタン ホバー用 end */


/* 外部リンク */
a.link-blank::after {
    content: url("/assets/img/icon_link_brank.svg");
    margin-left: 0.25em;
}

a.link-blank-blue::after {
    content: url("/assets/img/icon_link_brank_blue.svg");
    margin-left: 0.25em;
}

/* 外部リンク end */

.backgroud_blue_box {
  	color: #000;
	margin-top: 0.8%;
	padding: 0.8%;
    width: 100%;
	background-color: rgba(17, 103, 143, 0.1);
	margin-bottom: 10px;
	text-align: center;
}


/* 「上へ戻る」ボタン */
#page_top{
	display: none;
  width: 50px;
  height: 50px;
  position: fixed;
  right: 5%;
  bottom: 50px;
  background: #00709e;
  opacity: 0.5;
  /*border-radius: 50%;*/
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -11px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
/* 「上へ戻る」ボタン end */


.flex{
    display:flex;
    justify-content:flex-start;
  }
.flex img{
	width: 100%;
	display: block;
}
.flex_contents {
	width: 100%;
}

  .flex_contents+.flex_contents{
    margin-left:0.5em;
  }


/* お問い合わせフォーム */
.form-box{
	margin: 0 auto;
}
.form-box p{
	padding: 0 0 25px;
}
.form-item {
    padding: 0 0 40px;
}
input.txt-area, textarea.txt-area {
    width: 98%;
    padding: 0.6em;
    outline: none;
    border: 1px solid #DDD;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 85%;
}

input#submit_button {
    cursor: pointer;
    outline: none;
    appearance: none;
	display: block;
	padding: 0 15px;
	background-color: #00709E;
    border: 1.5px solid #00709E;
    color: #fff;
    padding: 15px 0;
    width: 100%;
    font-size: 120%;
    margin-bottom: 20px;
    cursor: pointer;
	-webkit-appearance: none;
   border-radius: 0;
}
input#submit_button:hover {
	color: #00709e;
	background-color: #fff;
}
.form-thanks{
	text-align: center;
}
.form-thanks h3{
	margin: 50px auto 0;
}
.form-thanks p{
	margin: 10px auto 50px;
}
.back-btn a{
	text-decoration: none;
    padding: 15px 40px;
    background-color: #fff;
    color: #00709e;
    border: solid 1px #00709e;	
}
.back-btn a:hover {
    background-color: #00709e;
    color: #fff;
    border: solid 1px #00709e;
}

/* お問い合わせフォーム end */

section {
	margin-bottom: 40px;
}

@media screen and (max-width: 768px) {
	body {
	font-size: 85%;
	}
	.for-sp{display: block;}
	.for-pc{display: none;}
	.wrapper {margin: 0 4%;}
	.main {width: 100%;}
	.main-caption h2 {
		font-size: 90%;}

	h1 .explain {
    font-size: 14px;
	}
	.h1_bg {
		padding: 0 1em;
		margin: 0 -4%;
		margin-bottom: 20px;
        
	}
	.attention p{
		text-align: left;
		}
	/* パンくず sp */
	.pankuzu, .h1_bg h1 {
		margin: 0 1%;
		width: auto;
		font-size: 2em;
	}
	.pankuzu{font-size: 90%;}
	.pankuzu_bg{
		margin: 0 -4%;
		padding: 0 1em;
	}
	/* パンくず sp end */

	
	/* ストリートビュー sp */
	.st_view ul, .room_gaiyo ul  {
		display: block;}
	.st_view ul li img{
		width: 100%;
	}
	.st_view ul li:first-child {margin: 0;}
	.st_view iframe.for-sp{
	margin:0 0 4px 0;
	}
	.st_view .p12.for-sp{
	margin: 0 0 2px;
	}
	/* ストリートビュー sp end */	
	
	
	/* お問い合わせ番号 BOX sp */
	.info_box{
		font-size: 90%;
	}
	/* お問い合わせ番号 BOX sp end */
	
	
	.room_gaiyo ul li{	margin: 0;}
	
	
	/* お読みください sp */
	.read_box{
        padding: 0 4% 5%;	
    }
	.read_box h3 {margin-bottom: 1em;}
	.read_box ul li ul li {
		margin-left: 0.5em;
	}
	/* お読みください sp end */
	
	
	.flex{
    display:block;
	}
	.flex.layout-btn{
    display:flex;
	}
	.flex_contents+.flex_contents{
    margin-left:0;
	}
	.main-contents .flex-between, .topics-contents .flex-between{
		display: block;
	}
	
	/* モーダル画像幅調整  */
	.modaal-content-container img{
		width: 100%;
	}
	/* モーダル画像幅調整 end */
	
	/* ページトップへ  */
	#page_top{
		margin: 0 -4%;
	}
	
	#page_top_sp{
		display: none;
	  width: 50px;
	  height: 50px;
	  position: fixed;
	  right: 5%;
	  bottom: 50px;
	  background: #00709e;
	  opacity: 0.5;
	  /*border-radius: 50%;*/
	}
	#page_top_sp a{
	  position: relative;
	  display: block;
	  width: 50px;
	  height: 50px;
	  text-decoration: none;
	}
	#page_top_sp a::before{
	  font-family: 'Font Awesome 5 Free';
	  font-weight: 900;
	  content: '\f106';
	  font-size: 25px;
	  color: #fff;
	  position: absolute;
	  width: 25px;
	  height: 25px;
	  top: -11px;
	  bottom: 0;
	  right: 0;
	  left: 0;
	  margin: auto;
	  text-align: center;
	}
	
	/* ボタン ホバー用  */
	.g-slide .btn-hover-mini{
		width: 100%;
		margin: 0 0 20px;
		}
	.g-slide .btn-hover-mini.btn-end{
		width: 100%;
		/*margin: 0 5% 0;*/
	}
	/* ボタン ホバー用 end */
	
	
	
	/* お問い合わせフォーム */
	.form-box{
		width: 100%;
	}
	.info_box ul li {
		margin: 0
	}
	input.txt-area, textarea.txt-area {
		width: 95%;
	}


/* お問い合わせフォーム end */

}