@charset "UTF-8";

/*////////////////////////////////////////////////////////////////////////*/
/*共通CSS*/

.pcalt{
	display:none;}

body {
	height:100%;
	width:100%;
	min-width:970px;
	margin:0px auto;
	padding:0px;
	line-height:220%;
	color:#333;
	background:#FFF url(../img/bg.jpg) no-repeat right top;
}


p{line-height:1.5em;}

.gospsite{
display:block;
font-size: 50px;
font-weight: bold;
color: #111 !important;
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4), 0 1px 1px rgba(255, 255, 255, 0.5);
letter-spacing: 0;
border-bottom: 1px solid #ccc;
text-decoration: none;
padding: 80px 0px;
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ffffff), color-stop(0.51, #cccccc), color-stop(0.47, #ffffff), color-stop(0.00, #c7c7c7));
background: -webkit-linear-gradient(top, #c7c7c7 0%, #ffffff 47%, #cccccc 51%, #ffffff 100%);
background: -moz-linear-gradient(top, #c7c7c7 0%, #ffffff 47%, #cccccc 51%, #ffffff 100%);
background: -o-linear-gradient(top, #c7c7c7 0%, #ffffff 47%, #cccccc 51%, #ffffff 100%);
background: -ms-linear-gradient(top, #c7c7c7 0%, #ffffff 47%, #cccccc 51%, #ffffff 100%);
background: linear-gradient(to bottom, #c7c7c7 0%, #ffffff 47%, #cccccc 51%, #ffffff 100%);


}

.topline{ height:20px;margin:0 auto; padding:0 5px; width:970px;color:#666; text-align:left;}

#CONTAINER{ width:970px;margin:0 auto;}
#HEADER{ width:970px; height:110px; position:relative;}
#logo{ position:absolute;top:0; left:0;}
#logo a{width:320px; height:90px; background:url(../img/globalparts.png) no-repeat 0 0; display:block;}
.reserve{ position:absolute;top:0; right:0;}
.reserve a{width:239px; height:98px; background:url(../img/globalparts.png) no-repeat -200px -225px; display:block;}
.language{position:absolute;bottom:15px;right:260px;font-size:16px; font-family: 'Noto Sans', sans-serif;}
.language a{color:#fff;padding:6px 40px;background:#84961c; 
border-radius: 5px;		/* CSS3草案 */
-webkit-border-radius: 5px;	/* Safari,Google Chrome用 */
-moz-border-radius: 5px;	/* Firefox用 */
display:block;}
.language a:hover{color:#fff;}

#MAINAREA{width:970px; background:url(../img/menubg.jpg) repeat-y left top;}

#LEFTAREA{width:200px; float:left;}
#MENUAREA ul li{background:url(../img/line.png) no-repeat left bottom; padding-bottom:1px;}
#MENUAREA ul li a{ width:200px; height:39px; background:url(../img/globalparts.png) no-repeat left bottom; display:block;}
#MENUAREA ul li a:hover{ background-color:#fff !important;}
#MENUAREA ul li#menu1 a{ background-position:0 -116px;}
#MENUAREA ul li#menu2 a{ background-position:0 -156px;}
#MENUAREA ul li#menu3 a{ background-position:0 -196px;}
#MENUAREA ul li#menu4 a{ background-position:0 -236px;}
#MENUAREA ul li#menu5 a{ background-position:0 -276px;}
#MENUAREA ul li#menu6 a{ background-position:0 -316px;}
#MENUAREA ul li#menu7 a{ background-position:0 -356px;}
#MENUAREA ul li a:hover{ width:200px; height:39px; background:url(../img/globalparts.png) no-repeat left bottom; display:block;}
	#MENUAREA h2{width:200px; background:url(../img/line.png) repeat-x left bottom;}
	#MENUAREA h2 span{width:200px; height:25px;background:url(../img/globalparts.png) no-repeat 0px -90px; font-size:1px;line-height:1px;text-indent:-9999px; display:block;}

#MENUAREA .menu_reserve{margin-bottom:20px;}

#MENUAREA .menu_reserve h2 span{background:url(../img/reserve.png) no-repeat 0 0;}

#MENUAREA .menu_reserve ul li a{ background:url(../img/reserve.png) no-repeat;}
#MENUAREA .menu_reserve ul li#m_reserve1 a{ background-position:0 -27px;}
#MENUAREA .menu_reserve ul li#m_reserve2 a{ background-position:0 -67px;}


	#MENUAREA .bnr1,#MENUAREA .bnr2,#MENUAREA .bnr3,#MENUAREA .bnr4,#MENUAREA .bnr5{width:190px; height:50px; margin:5px auto;}
    #MENUAREA .bnr4{margin-top: 20px;}
	#MENUAREA .bnr1 a,#MENUAREA .bnr2 a{width:190px; height:50px; background:url(../img/bnr.jpg) no-repeat; display:block;}
	#MENUAREA .bnr1 a{ background-position:0 0;}
	#MENUAREA .bnr2 a{background-position:0 -50px;}
	#MENUAREA .bnr3 a{width:190px; height:50px;background:url(../img/sp/bnr_dantai.png) no-repeat; display:block;}
	#MENUAREA .bnr4 a{width:190px; height:50px;background:url(../img/bnr_covid19.jpg) no-repeat; display:block;}
	#MENUAREA .bnr5 a{width:190px; height:50px;background:url(../img/bnr_goyu.jpg) no-repeat; display:block;}
	#MENUAREA .bnr6 a{width:190px; height:50px;background:url(../img/bnr_suzume.jpg) no-repeat; display:block;}


	#MENUAREA .btn_blog{width:190px; height:70px; margin:20px auto;}
	#MENUAREA .btn_blog a{width:190px; height:70px; background:url(../img/globalparts.png) no-repeat -200px -90px; display:block;}

#INTRODUCTION #MENUAREA ul li#menu1 a,
#STAYPLAN #MENUAREA ul li#menu2 a,
#SPA #MENUAREA ul li#menu3 a,
#COOKING #MENUAREA ul li#menu4 a,
#HISTORY #MENUAREA ul li#menu5 a,
#COUPON #MENUAREA ul li#menu6 a,
#ACCESS #MENUAREA ul li#menu7 a{ background-color:#fff !important;}

	#MOBILE h2{width:200px; background:url(../img/line.png) repeat-x left bottom;}
	#MOBILE h2 span{width:200px; height:25px;background:url(../img/globalparts.png) no-repeat -200px -200px; font-size:1px;line-height:1px;text-indent:-9999px; display:block;}

	#MOBILE .qrcode img{width:137px; height:137px; margin:10px auto; display:block;}
#RIGHTAREA{width:750px; float:right; background:url(../img/cnt_rightbg.jpg) no-repeat left top; text-align:left;}

#RIGHTAREA  h2.title{width:500px; height:50px; margin-top:10px; background:url(../img/globalparts.png) no-repeat;font-size:1px;line-height:1px;text-indent:-9999px;}
	#INTRODUCTION #RIGHTAREA h2.title{ background-position:0 -395px;}
	#STAYPLAN #RIGHTAREA h2.title{ background-position:0 -445px;}
	#SPA #RIGHTAREA h2.title{ background-position:0 -495px;}
	#COOKING #RIGHTAREA h2.title{ background-position:0 -545px;}
	#HISTORY #RIGHTAREA h2.title{ background-position:0 -595px;}
	#COUPON #RIGHTAREA h2.title{ background-position:0 -645px;}
	#ACCESS #RIGHTAREA h2.title{ background-position:0 -695px;}
	#RESERVE #RIGHTAREA h2.title{ background-position:0 -745px;}
	#ERROR #RIGHTAREA h2.title{ background-position:0 -795px;}

#RIGHTAREA h3{ font-weight:normal; font-size:300%; margin:20px 0 10px 0; line-height:120%;}
#RIGHTAREA h4{ font-weight:normal; font-size:200%; margin:20px 0 10px 0; color:#84961c; background:url(../img/line.png) repeat-x left bottom; padding-bottom:2px;}
#RIGHTAREA p{ font-size:140%; line-height:200%;}

ul.caution{font-size:120%;margin:15px 0;}
ul.caution li{text-indent:-1em;
padding-left:1em;}

#RIGHTAREA .cautionline{background:url(../img/line.png) repeat-x left top; padding-top:10px;}

#RIGHTAREA .rightbg{ background:url(../img/introduction_bg.jpg) no-repeat center bottom; padding-bottom:380px; position:relative;}
#RIGHTAREA dl dt{ font-size:140%;}
#RIGHTAREA dl dd{ font-size:140%; margin-left:20px;}


#FOOTER{ background:url(../img/footerbg.jpg) top left; margin-top:50px;}
#FOOTER .footerline{ background:url(../img/footertop.jpg) repeat-x top left; padding:20px 0 30px 0;}

#FOOTER .footerblock{ width:800px; padding-left:180px; margin:0 auto;background:url(../img/footerlogo.png) no-repeat center left;text-align:left; position:relative;}
#FOOTER .footerblock ul li{ display:inline-block; border-left:1px solid #999; font-size:120%;padding:2px 0;}
#FOOTER .footerblock ul li:first-child{ border:none;}
#FOOTER .footerblock ul li a{ color:#333; text-decoration:none; display:block; margin:0 10px;}
#FOOTER .footerblock ul li:first-child a{margin-left:0;}
#FOOTER .footerblock ul li a:hover{ color:#333; text-decoration:underline;}
#FOOTER .footerblock p.address{text-align:left; padding:0px 0 0 0px; color:#333; font-size:120%;}
#FOOTER .footerblock p.gopagetop{ position:absolute; top:-47px; right:0;}

#FOOTER .footerblock p.gopagetop a{width:140px; height:30px; background:url(../img/globalparts.png) no-repeat -200px -160px;font-size:1px;line-height:1px;text-indent:-9999px; display:block;}


/* トップページ #TOPPAGE */
#slideshow {
  width:970px; height:330px; margin-bottom:15px;
}

/*#TOPPAGE #MAINIMAGE{background:url(../img/main1.jpg) no-repeat 0 0; }*/
#TOPPAGE #GRAFFITI{width:970px; height:225px;margin-bottom:15px;background:url(../img/topparts.jpg) no-repeat 0 0; position:relative;}
#TOPPAGE #GRAFFITI li{position:absolute;}
#TOPPAGE #GRAFFITI li.img1{top:21px; left:208px;}
#TOPPAGE #GRAFFITI li.img2{top:21px; left:398px;}
#TOPPAGE #GRAFFITI li.img3{top:21px; left:588px;}
#TOPPAGE #GRAFFITI li.img4{top:21px; left:778px;}
#TOPPAGE #GRAFFITI li img{width:160px; height:160px;}


#TOPPAGE #RIGHTAREA{ background:none;}
#RIGHTAREA #topLeft{width:460px; float:left;}
	#pickup{width:460px; margin-bottom:15px;}
	#pickup h2{width:460px; background:url(../img/line.png) repeat-x left bottom; padding-bottom:5px; margin-bottom:10px;}
	#pickup h2 span.title{width:170px; height:20px;background:url(../img/topparts.jpg) no-repeat -460px -325px; font-size:1px;line-height:1px;text-indent:-9999px; display:block;}
	#pickup ul li a{width:460px; height:100px;display:block; margin-bottom:10px;}

	#pickup ul li a:hover{filter: alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;}
	
	#information{width:460px; position:relative;}
	#information h2{width:460px; background:url(../img/line.png) repeat-x left bottom; padding-bottom:5px;}
	#information h2 span.title{width:90px; height:20px;background:url(../img/topparts.jpg) no-repeat -460px -345px; font-size:1px;line-height:1px;text-indent:-9999px; display:block;}
	#information .btnlist{ position:absolute; top:0; right:0; display: inline; background:url(../img/bit1.png) no-repeat left center; padding:5px 0 5px 18px; text-align:left; font-size:110%;}
	#information ul{ height:220px; overflow:auto; padding:10px 0;}
	#information ul li{ text-align:left; font-size:120%; padding-left:10px;}
	#information ul li span.date{ width:80px; float:left; display:block;}
	#information ul li span.param{ width:340px; float:left; display:block;}

	#information #trip-ai{margin-top:20px;}
#RIGHTAREA #topRight{width:270px; float:right; }

#RIGHTAREA #topRight .fb-page blockquote a{height:690px;}

/* くりこま荘のご案内 #INTRODUCTION */
#INTRODUCTION #RIGHTAREA p{width:460px;}

#INTRODUCTION .imgarea{ background:#fff; border:1px solid #ccc; padding:5px 5px 0px 5px; position:absolute; top:0; right:0;}
#INTRODUCTION .imgarea ul li{width:260px; height:150px; padding-bottom:5px;}
#INTRODUCTION .imgarea ul li img{width:260px; height:150px;}


/* 宿泊プラン #STAYPLAN */
#STAYPLAN #RIGHTAREA p{width:460px;}
#STAYPLAN #RIGHTAREA h4{width:460px;}

table.plicelist{ font-size:120%; border:1px solid #ccc;border-collapse:collapse;}
.plicelist th{ background:#cc0000; color:#fff; text-align:center;border:1px solid #ccc; border-collapse:collapse;}
.plicelist td{padding:5px;border:1px solid #ccc; border-collapse:collapse;}
.plicelist td.thead{ background:#eee;}
#STAYPLAN .imgarea{ background:#fff; border:1px solid #ccc; padding:5px 5px 0px 5px; position:absolute; top:0; right:0;}
#STAYPLAN .imgarea ul li{width:260px; height:150px; padding-bottom:5px;}
#STAYPLAN .imgarea ul li img{width:260px; height:150px;}
#STAYPLAN .imgarea2{margin:10px 260px 10px 0px; text-align:center; font-size:120%; line-height:110%;}
#STAYPLAN .imgarea2 span{width:230px; height:150px; padding:5px; background:#fff; border:1px solid #ccc; display:block; margin:5px auto;}

/* お料理 #COOKING */
#COOKING #RIGHTAREA .rightbg{ background:url(../img/cooking_bg.jpg) no-repeat center bottom;padding-bottom:370px;}
#COOKING #RIGHTAREA p.cookingimg{ background:url(../img/cookingimg.png) no-repeat right bottom; min-height:260px;padding-right:340px;}



#COOKING .imgarea li{width:245px; float:left; margin:0 5px 15px 0; text-align:center; font-size:120%; line-height:110%;}
#COOKING .imgarea li img{padding:5px; background:#fff; border:1px solid #ccc;margin-bottom:5px;}

.iwanadon{width:620px; border:3px double #84961c; margin:20px auto; padding:15px;}
.iwanadon img{ float:right; margin-left:10px}

/* 温泉について #SPA */
#SPA #RIGHTAREA .rightbg{ background:url(../img/spa_bg.jpg) no-repeat center bottom;padding-bottom:450px;}
#SPA #RIGHTAREA p{width:460px;}
#SPA #RIGHTAREA h4{width:460px;}
#SPA #RIGHTAREA dl{width:460px;}
#SPA #RIGHTAREA dl dt{width:115px; line-height:150%;}
#SPA #RIGHTAREA dl dd{ margin:-1.5em 0 1em 125px; line-height:150%;}

#SPA .imgarea{ background:#fff; border:1px solid #ccc; padding:5px 5px 0px 5px; position:absolute; top:0; right:0;}
#SPA .imgarea ul li{width:260px; height:150px; padding-bottom:5px;}
#SPA .imgarea ul li img{width:260px; height:150px;}


/* 歴史の秘話 #HISTORY */
#HISTORY #RIGHTAREA .rightbg{ background:url(../img/history_bg.jpg) no-repeat center bottom;padding-bottom:550px;}
#HISTORY #RIGHTAREA p{width:460px;}

#HISTORY .imgarea{ background:#fff; border:1px solid #ccc; padding:5px 5px 0px 5px; position:absolute; top:0; right:0;}
#HISTORY .imgarea ul li{width:260px; height:150px; padding-bottom:5px;}
#HISTORY .imgarea ul li img{width:260px; height:150px;}

/* アクセス #ACCESS */
#ACCESS #RIGHTAREA .floatL{width:290px;}
#ACCESS .map{width:443px; height:367px; border:1px solid #ccc; float:right; }

/* お問い合わせ #RESERVE */
#RESERVE #RIGHTAREA .rightbg{ min-height:200px;}



.couponticket{margin:15px auto;
		background:url(../img/coupon_bg.jpg) no-repeat center left;
		border:10px solid #83961d;
		padding:80px 10px 10px 180px;
		position:relative;}
.couponticket:before{
	position:absolute;
	top:10px;
	left:170px;
	content:url(../img/coupon_logo.jpg);
	}
	
.couponticket .title{
	font-size:240% !important;
	line-height:1.2em !important;
	font-weight:bold;
	margin:10px 0 0;
	}
.couponticket .title_sub + .title {
	margin:0;
	}
.couponticket .expirationdate{
	margin-top:20px;}

/*フォーム用*/

div#mf_wrapper {
	width: 640px;
	text-align: left;
	margin: 0px auto 0px auto;
	font-family: sans-serif;
}
div#mf_header h1 {
	font-size: 24px;
	border-bottom: solid 1px #999999;
	margin: 0px;
	padding: 0px;
}
div#mf_header h2 {
	font-size: 16px;
	color: #999999;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
}
form#mailform {
	padding: 5px;
}
table.mailform {
	width: 100%;
}
table.mailform tr th,table.mailform tr td {
	text-align: left;
	font-weight: normal;
	font-size: 12px;
	border-bottom: solid 1px #ccc;
	padding: 7px 5px 7px 5px;
}
table.mailform tr th {
	width: 150px;
}
table.mailform tr th span {
	color: #CC0000;
	font-size: 10px;
}
table.mailform tr th p {
	margin: 0px;
	padding: 0px;
	font-size: 10px;
	color: #999999;
}
table.mailform tr td textarea {
	width: 100%;
	height: 120px;
}

#ERROR #RIGHTAREA h3{padding-left:30px;}

/*


*/



/*eof*/