/* ---------------------------------------- /
/
/ 基本
/
/ ---------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-size: 100%;
	vertical-align: baseline;
}

html,body { width:100%; height:100%;}

body {
	margin: 0;
	padding: 0;
	font : 13px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: normal;
	color: #00122B;
}
img { border:none; outline:none; vertical-align:top;}
ol, ul{ list-style:none;}

a{
	color: #002e73;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:focus { outline:none;}


.clear{			clear:both;	}
.left{			float:left; }
.right{			float: right;}
.strong { font-weight:bold;}
.text_r{text-align:right;}
.center {text-align:center;}

.clearfix:before,
.clearfix:after {
    content: " ";
	display: table;}
.clearfix:after {
    clear: both;
}

/*css変数*/
:root {
   --dark_text-shadow: 
    black 2px 0px 2px, black -2px 0px 2px,
    black 0px -2px 2px, black -2px 0px 2px,
    black 2px 2px 2px, black -2px 2px 2px,
    black 2px -2px 2px, black -2px -2px 2px,
    black 1px 2px 2px, black -1px 2px 2px,
    black 1px -2px 2px, black -1px -2px 2px,
    black 2px 1px 2px, black -2px 1px 2px,
    black 2px -1px 2px, black -2px -1px 2px,
    black 1px 1px 2px, black -1px 1px 2px,
    black 1px -1px 2px, black -1px -1px 2px;
    --text-shadow: 
        rgba(0,0,0,0.3) 2px 0px 2px, rgba(0,0,0,0.3) -2px 0px 2px,
        rgba(0,0,0,0.3) 0px -2px 2px, rgba(0,0,0,0.3) -2px 0px 2px,
        rgba(0,0,0,0.3) 2px 2px 2px, rgba(0,0,0,0.3) -2px 2px 2px,
        rgba(0,0,0,0.3) 2px -2px 2px, rgba(0,0,0,0.3) -2px -2px 2px,
        rgba(0,0,0,0.3) 1px 2px 2px, rgba(0,0,0,0.3) -1px 2px 2px,
        rgba(0,0,0,0.3) 1px -2px 2px, rgba(0,0,0,0.3) -1px -2px 2px,
        rgba(0,0,0,0.3) 2px 1px 2px, rgba(0,0,0,0.3) -2px 1px 2px,
        rgba(0,0,0,0.3) 2px -1px 2px, rgba(0,0,0,0.3) -2px -1px 2px,
        rgba(0,0,0,0.3) 1px 1px 2px, rgba(0,0,0,0.3) -1px 1px 2px,
        rgba(0,0,0,0.3) 1px -1px 2px, rgba(0,0,0,0.3) -1px -1px 2px;
}


/* --------------　透過　------------------ */

a:hover img,
#cuisine .thumb01:hover,
#cuisine .thumb02:hover{
	opacity: 0.6;
	-moz-opacity: 0.6;
	filter: alpha(opacity = 60);
	-webkit-transition: all 0.3s linear 0s;
	-o-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
#nav a:hover img{
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity = 100);
	-webkit-transition: all 0.3s linear 0s;
	-o-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}

/* --------------　ラフ用　------------------ */





/* header */
#header {
	margin: 0 auto;
	position: relative;
	background-image: url(../img/header_bg.jpg);
}
#frame{
	width: 1000px;
	margin: 0 auto;
	padding: 10px 12px 0;
	background : url(../img/movie_bg.jpg);
}
#illust{
	width: 100%;
	position: absolute;
	bottom: 0px;
	background: url(../img/illust.png) no-repeat bottom left;
	overflow:hidden;
}
#sub_nav{
	width: 1024px;
	height: 227px;
	margin: 0 auto;
	position: relative;
}
#sub_nav .logo {
	position: absolute;
	left: -30px;
	bottom: 0;
}
#sub_nav .reserve {
	position: absolute;
	right: -54px;
	bottom: 0;
}

/* nav */
#nav ul{
	width: 1025px;
	margin: 0 auto;
}
#nav li {
	float: left;
}
#nav li:nth-child(1) {
	background-image: url(../img/nav01_on.jpg);
}
#nav li:nth-child(2) {
	background-image: url(../img/nav02_on.jpg);
}
#nav li:nth-child(3) {
	background-image: url(../img/nav03_on.jpg);
}
#nav li:nth-child(4) {
	background-image: url(../img/nav04_on.jpg);
}
#nav li:nth-child(5) {
	background-image: url(../img/nav05_on.jpg);
}
#tel p{
	width: 1025px;
	margin: 0 auto;
	padding: 3px 0;
	text-align: right;
}
#tel:after{
	content: " ";
	width: 100%;
	padding: 8px 0 0;
	display: block;
	background : url(../img/line_top.jpg) repeat-x;
}


/* footer */
#footer_nav {
	padding: 10px 0;
	border-top: 2px solid #002E73;
}
#footer_nav ul {
	text-align: center;
	letter-spacing: -1em;
}
#footer_nav li {
	display: inline-block;
	letter-spacing: normal;
	padding: 0 10px 0;
	border-right: 1px solid #002E73;
}
#footer_nav li:last-child {
	border-right: none;
}
#footer {
	width: 960px;
	margin: 0 auto;
	padding: 30px 0 10px;
	color: #FFFFFF;
}
#footer a {
	color: #FFF5BF;
}
#footer .left {
	height: 90px;
	background : url(../img/footer_line.jpg) repeat-y right top;
}
#footer .left p {
	margin: 0 30px 0 15px;
}
#footer .left p span {
	font-size: 15px;
	font-weight: bold;
}
#footer .left img {
	margin: 0 40px 0 0;
}
#footer .right {
    display:table;
    height:90px;
}
#footer .right p {
    display:table-cell;
    vertical-align:middle;
}
#footer .right img {
	margin: 0 0 5px;
}
#copy {
	text-align: center;
	padding: 25px 0 0;
	clear: both;
	font-size: 10px;
}




/* main */
#main {
	margin: 0 auto;
	padding: 17px 0 0;
	font-size: 14px;
}
#main .left{
	width: 520px;
	padding: 25px 0 0;
}
#main .right{
	margin: 35px 0;
}
#main:after{
	content: " ";
	width: 100%;
	padding: 25px 0 0;
	display: block;
	background : url(../img/line_bottom.jpg) left bottom repeat-x;
}
#main .textbox {
	width: 994px;
	height: 349px;
	margin: 0 auto;
	padding: 0 0 0 30px;
	background : url(../img/main_bg2.png) no-repeat;
}
#main .textbox .right{
	margin: 35px 0;
}
#main .textbox p{
	margin: 0 0 5px;
	font-size: 14px;
}


/* title */
h1 {
	width: 1024px;
	margin: 5px auto 0;
	color: #002E73;
	font-size: 12px;
}
h2 {
	margin: 0 0 15px;
}
h3 {
	padding: 0 0 50px;

}
#facility h4,
#cuisine h4 {
	height: 31px;
	padding: 3px 0 0 32px;
	background : url(../img/h4_bg.jpg);
}
#reserve h4,
#access h4{
	margin: 20px 0;
}
#sightseeing h4 {
	margin: 0 0 20px;
}
h5 {
	color: #CD0505;
	padding: 0 0 5px;
	margin: 0 0 5px;
	border-bottom: 1px dashed #CD0505;
	font-size: 14px;
}


/* main content */
#main_content {
	margin: 35px auto 0;
	width: 960px;
}
#main_content span{
	color: #CD1B28;
}
#main_content .box01,
#main_content .box02,
#main_content .box03,
#main_content .box04{
	margin: 0 0 70px;
}
#main_content .box01,
#main_content .box02{
	background : url(../img/h3_bg.jpg) 0% 40px no-repeat;
}
.m_box{
	margin: 0 auto;
	width: 920px;
}
#pagetop {
	text-align: right;
	color: #002E73;
}

#nav,
#footer_bg{
	background : #002E73;
}

.plan_bnr_wrap .cancel {
	font-size: 15px;
}



/* index */
#index #main{	
	background: url(../img/index/main_bg.jpg) center center / cover no-repeat;
}
#index #main .textbox {
	height: 426px;
	position: relative;
	background : url(../img/index/main_bg.png) no-repeat;
	padding: 30px 0 0 30px;
}
#index #main .textbox .photo{
	position: absolute;
	right: 0px;
	top: 30px;
}
#index h3 {
	padding: 4px 0 0 33px;
	margin: 0 0 20px;
	background : url(../img/h4_bg.jpg);
}
#index h4 {
	background : url(../img/h5_bg.jpg) no-repeat;
	padding: 2px 0 0 28px;
	margin: 0 0 14px;
}
#plan {
	margin: 0 0 45px;
}
#index #main_content .left,
#index #main_content .right {
	height: 280px;
	margin: 0 0 20px;
	background : url(../img/line_red.jpg) left bottom no-repeat;
}
#index #main_content .right {
	width: 265px;
}
#index .plan_bnr_wrap {
	width: 662px;
    margin: 0 auto;
}

/* facility */
#facility #main {
	background: url(../img/facility/main_bg.jpg) center center / cover no-repeat;
}
#facility .box01 .m_box .right {
	background-image: url(../img/facility/box_bg.jpg);
	height: 311px;
	padding: 40px 0 0;
	margin: 48px 0 0 0;
	width: 312px;
}
#facility .box01 .m_box .right .m_box {
	margin: 0 auto;
	width: 286px;
}
#facility .box01 .m_box .right .m_box img {
	margin: 0 0 10px;
}
#facility .box01 .m_box .clear {
	padding: 15px 0 0;
}
#facility #main_content .box02 .m_box{
	margin: 0 0 0 20px;
	width: 940px;
}
#facility #main_content .box03 .left,
#facility #main_content .box03 .right {
	width: 460px;
}
#facility #main_content .box03 h4 {
	margin: 0 0 25px;
}
#facility #main_content .box03 .m_box {
	width: 420px;
	margin: 0 auto;
}
#facility #main_content .box03 .m_box img {
	margin: 0 0 10px;
}
#facility #main_content .box04 {
	padding: 0 0 30px;
	background : url(../img/line_red.jpg) left bottom repeat-x;
}
#facility #main_content .box04 h4 {
	margin: 0 0 20px;
}
dl {
	margin: 0 auto 20px;
	width: 920px;
}
dt{
	width: 8em;
	float: left;
	clear : both;
	text-align: right;
	font-weight: bold;
	color: #002E73;
	font-size: 14px;
}
dt,
dd{
	padding: 10px 0;
}
dd{
	border-bottom: 1px dashed #00122B;
}
dd:last-child{
	border-bottom: none;
}
#facility #main_content .box04 .m_box {
	position: relative;
}
#facility #main_content .box04 .m_box p {
	margin: 0 26px 0 0;
	float: left;
}
#facility #main_content .box04 .m_box p:last-child {
	margin: 0;
}
#facility .comment {
	position: absolute;
	right: 255px;
	top: 7px;
}



/* cuisine */
#cuisine #main {
	background: url(../img/cuisine/main_bg.jpg) center center / cover no-repeat;
}
#cuisine #main_content .box01 .photo,
#cuisine #main_content .box02 .photo{
	height: 360px;
	margin: 0 0 20px;
	position: relative;
}
#cuisine #main_content .box01 .m_box .content01,
#cuisine #main_content .box02 .m_box .content02{
	width: 582px;
	height: 360px;
	border: none;
	top: 0;
	left: 0;
	position: absolute;
}
#cuisine #main_content .box01 .m_box .thumb01,
#cuisine #main_content .box02 .m_box .thumb02{
	width: 328px;
	height: 84px;
	display: block;
	cursor: pointer;
	z-index: 50;
	margin: 0 0 8px 592px;
	clear: both;
}
#cuisine #main_content .box03 h4 {
	margin: 0 0 35px;
}
#main_content .box03  .right {
	margin: 0 0 0 30px;
	width: 495px;
}



/* reserve */
#reserve #main_content .center {
	margin: 0 0 30px;
}
table {
	width: 920px;
	margin: 0 auto;
	border-collapse: collapse;
}
table,
td{
	border : 1px solid #3F3F3F;
}
th {
	text-align: right;
	white-space: nowrap;
	color: #FFFFFF;
	background : #002E73;
	border-bottom: 1px dashed #FFFFFF;
}
td{
	background-color: hsla(0,0%,100%,0.80);
}
th,
td{
	padding: 10px 20px;
}
#reserve #main_content .box01 .m_box ul {
	list-style-type: disc;
	margin: 5px 0 0;
	list-style-position: inside;
}
#reserve .cancel th, 
#reserve .cancel td{
	text-align: center;
	border : 1px solid #3F3F3F;
}
#reserve #main_content .box02 .left {
	margin: 40px 0 0 90px;
}
#reserve #main_content .box02 .left p{
	font-size: 14px;
	margin: 0 0 15px;
	text-align: center;
}
#reserve #main_content .box02 .left .name,
#reserve #main_content .box02 .left span {
	color: #002E73;
	font-weight: bold;
}
#reserve #main_content .box02 .left .name {
	font-size: 15px;
}
#reserve #main_content .box02 .left span {
	font-size: 17px;
}
#reserve #main_content .box02 .right {
	margin: 0 20px 0 0;
}



/* access */
#access #main_content .box01 .m_box p {
	font-size: 14px;
	margin: 0 0 30px;
}
#access #main_content .box01 .m_box:last-child {
	border: 1px solid #002E73;
}
#access #main_content .box01 .m_box:last-child h5{
	margin: 10px 0;
	padding: 0 0 0 10px;
	border : none;
	border-left: 10px solid #002E73;
	color: #002E73;
}
#access #main_content .box01 .m_box:last-child p{
	margin: 0 0 10px 30px;
}



/* sightseeing */
#sightseeing #main_content .box01 a{
	color: #1062bc;
	text-decoration: underline;
}
#sightseeing #main_content .box01 a:hover{
	color: #1062bc;
	text-decoration: none;
}
#sightseeing #main_content .box01 .m_box {
	width: 890px;
	margin-bottom: 20px;
	padding: 15px;
	border: 1px solid #002E73;
}
.box_wrap,.box_wrap *{
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
#sightseeing #main_content .box01 .box_wrap{
   width: min(100%,922px);
    margin-inline: auto;
    margin-bottom: 40px;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
}
.box_wrap .box{
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-template-rows: subgrid;
    grid-row: span 5;
    gap:5px;
    border: 1px solid #002E73;
    padding-bottom: 15px;
    background: #fff;
    filter: drop-shadow(2px 2px 5px rgba(0,0,0,0.2));
}
.box_wrap .box > h3,
.box_wrap .box > p{
    padding-inline: 15px;
}
.box_wrap .box > h3{
    display: grid;
    color: #CD0505;
    border-bottom: dashed 1px #CD0505;
    width:calc(100% - 30px);
    margin-inline: auto;
    padding-block: 5px;
}
.box_wrap .box > h3 span{
    width: fit-content;
    font-size: 18px;
    line-height: 1.4;
    justify-self: center;
}
.box_wrap .box > p{
    text-align: left;
    font-size: 14px;
    line-height: 1.6;
}
.box_wrap .box > p.access{
    text-align: right;
    padding-right: 20px;
}
.box_wrap .box > p.link{
    display: grid;
    grid-template-columns: 15px minmax(0,1fr);
    gap: 0 0.5em;
    align-items: center;
}
.box_wrap .box > p.link img{
    width:15px;
    height: auto;
    aspect-ratio: 1!important;
    object-fit: contain;
}
.box_wrap .box > p.link span{
    color: #666!important;
}
.box_wrap .box:not(:has(a)) p.setumei{
    grid-row: span 2;
}
.box_wrap .box > .link:not(:has(a)){
    display: none;
}
.box_wrap .box > p a{
    font-size: 13px;
    white-space: wrap;
    overflow-wrap: break-word;
}

#sightseeing #main_content .box01 .box_wrap img{
   width: 100%;
    height: auto;
    aspect-ratio:6 / 4;
    object-fit: cover;
}
#sightseeing .box.inncap > img{
    grid-column: 1 / -1;
    grid-row: 1 / 2;
}

#sightseeing .box.inncap span.caption{
    grid-column: 1 / -1;
    grid-row: 1 / 2;
    align-self: end;
    justify-self: end;
    color:#fff;
    padding: 5px;
    text-shadow: var(--text-shadow);
}

#sightseeing .box01 .m_box .right {
	width: 615px;
}
#sightseeing .box01 .m_box .right p:last-child {
	margin: 10px  0 0;
	color: #1062bc;
}
/* プランRSS */
#mini{
	width: 312px;
	height: 401px;
	background-image: url(../../common/img/index/plan_bg.jpg);
	display: inline-block;
/*	margin: 0 3px;*/
	overflow: hidden;
	margin-right:12px;
}
#plan #mini:last-child{
	margin-right:0;
}
#minileft{
	margin-top: 15px;
	text-align: left;
	margin: 0 auto;
	width: 280px;
}

#minileft h5{
	border: none;
	padding: 10px 0;
	margin: 0;
}

#minileft h5 a{
	color: #d74651;
}

#miniright{
	margin-top: 45px;
	text-align: center;
}

#miniright img{
	width: 280px;
	height: 186px;
	border: 1px solid #FFF;
}