@charset "Shift_JIS";

/* ------------------------------
Dynatech HOTEL STORY
RESERVE FORM
ver.2004
------------------------------ */
body {
background-color: #FFFFFF;
}

/* ------------------------------
HEADING
------------------------------ */
#original_maincol .plantitle h1{
color:#000;
}

h2,
#original_maincol h2 {
color: #FFFFFF;
border-left: 5px solid #333;
background-color: #777;
}

#original_maincol h3 {
color: #222;
background: #ccc;
padding:2px 5px;
}

.plantitle{background:#ccc;padding:6px 0px 3px 10px;}

.cap {
color: #740402;
}

.onelinecap {
color: #740402;
}


/* ------------------------------------------
	Original Header
------------------------------------------ */
html, body, div, p, dl, dt, dd, ul, ol, li, span, strong, em, table, th, td { margin: 0; padding: 0;}
ul, li		{ list-style-type: none;}

body			{ font-size:16px; font-size:84%; line-height:175%;}
body			{ background-position: top center;line-height: 110%; margin:0;padding: 0;}

#footer-navi a		{ text-decoration: underline;}
#footer-navi a:hover	{ text-decoration: underline;}


#direct_in		{ width: 760px; margin-bottom:25px; text-align: center; font-size: 12px;}
#direct_in ul		{ list-style: none; margin: 0; padding: 0;}
#direct_in ul li	{ display: inline; padding: 0 10px; border-right: 1px solid #ddd;}
#direct_in ul li.last	{ border-right: none;}
#direct_in ul li a	{ color:#333333; text-decoration: underline;}
#direct_in ul li a:hover{ color:#333333; text-decoration: none;}

#original_maincol	{ width: 800px; margin: 0 auto; padding:15px; font-size:100%;}
input[type="text"]	{ font-family:Arial,Helvetica,sans-serif;}

#original_maincol	{ width: 800px; margin: 0 auto; padding: 15px; font-size: 16px;}
#original_maincol h3 span.di_red_caption { color: #FFFFFF;}




header a,
footer a{color:#000 !important;}
/*
--------------------------------------------------
	header
-------------------------------------------------- */
header {
	height: 99px;
	width: 100%;text-align: center;
     -webkit-box-shadow: 0 0 10px rgba(0,0,0,.5);
    box-shadow: 0 0 10px rgba(0,0,0,.2);
}
.header-inner {
	width: 1100px;
	margin: 0 auto;
	overflow:hidden;
}
header .logo {
	float: left;
	margin-top: 30px;
}

header .logo a{
	display: block;width: 140px;height: 0;
	padding-top: 40px; overflow: hidden;
	background: url(https://www.jiyujinhotels.com/koyanagi/img/logo_koyanagi.svg) no-repeat 50% 50%;
	-webkit-background-size: contain;
	background-size: contain;

}

.menuBtn {
    display: block;
    float: right;
    margin-top: 25px;
    width: 44px;
    height: 44px;
}
.header_wrap .menuBtn .modalBtn{
    cursor: pointer;
    text-decoration: none;
    position: relative;
    display: block;
    z-index: 1003;
  width: 35px;height: 38px;
  margin-left: 6px;
}
.header_wrap .modalBtn.active {width: 36px;}
.modalBtn span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.modalBtn span {
  position: absolute;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: #000;
}
.modalBtn span:nth-of-type(1) {
  top: 18%;
}
.modalBtn span:nth-of-type(2) {
  top: 48%;
}
.modalBtn span:nth-of-type(3) {
  bottom: 19%;
}
.menuBtn.close span:nth-of-type(1),
.modalBtn.active span:nth-of-type(1) {
  -webkit-transform: translateY(-8px) rotate(-210deg);
  transform: translateY(8px) rotate(-210deg);
}
.menuBtn.close span:nth-of-type(2),
.modalBtn.active span:nth-of-type(2) {
  opacity: 0;
}
.menuBtn.close span:nth-of-type(3),
.modalBtn.active span:nth-of-type(3) {
  -webkit-transform: translateY(-8px) rotate(210deg);
  transform: translateY(-8px) rotate(210deg);
}
.menuBtn.close span:nth-of-type(3){bottom: 35%;}

header .right{
  margin-top: 0;
  text-align: center;padding-top: 53px;
  position: absolute;left: 0;top: 98px;width: 100%;
  background: #fff;
  padding: 42px 0;
  border-top: 1px solid #c8c8c8;
  border-bottom: 1px solid #c8c8c8;
  font-size: 14px;line-height: 1.7;
}
header .right a{display: inline-block;margin: 0 20px;}



/*
--------------------------------------------------
	footer
-------------------------------------------------- */
footer {
	width: 100%;
	border-top: 1px solid #c8c8c8;
}
footer p{font-size: 12px;}
footer .logo{
	background: url(https://www.jiyujinhotels.com/koyanagi/img/logo_koyanagi.svg) no-repeat 50% 50%;
	-webkit-background-size: contain;
	background-size: contain;

	width: 130px;height: 0;padding-top: 28px;
	overflow: hidden;
	margin-right: 20px;
}
footer .footer-inner{width: 1100px;margin: auto;overflow: hidden;padding: 80px 0 90px;}
footer .information {float: left;vertical-align: bottom;}
footer .information>*{display: inline-block;vertical-align: bottom;}

footer .information .sns{overflow: hidden;}
footer .information .sns li {float: left;margin-left: 16px;}
footer .information .sns li a{
	display: block;
	height: 0;padding-top: 20px;overflow: hidden;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	-webkit-background-size: contain;
	background-size: contain;
}
footer .information .mail{margin-left: 20px;margin-right: 10px;}
footer .information .mail a{text-decoration: underline;}
footer .information .sns li.facebook a{background-image: url(https://www.jiyujinhotels.com/koyanagi/css/img/icon_facebook.svg);width: 12px;}
footer .information .sns li.twitter a{background-image: url(https://www.jiyujinhotels.com/test/common/tmpresp001_01_ori/img/icon_twitter.svg);width: 22px;}
footer .information .sns li.instagram a{background-image: url(https://www.jiyujinhotels.com/koyanagi/css/img/icon_instagram.svg);width: 18px;}

footer .copyright {float: right;padding-top: 24px;}