@charset "utf-8";

/*----------------------------
	PC用
------------------------------*/

/* margin : top */
.mt0em { margin-top:0em !important; }
.mt0_5em { margin-top:0.5em !important; }
.mt1em { margin-top:1em !important; }
.mt1_5em { margin-top:1.5em !important; }
.mt2em { margin-top:2em !important; }
.mt2_5em { margin-top:2.5em !important; }
.mt3em { margin-top:3em !important; }
.mt3_5em { margin-top:3.5em !important; }
.mt4em { margin-top:4em !important; }
.mt4_5em { margin-top:4.5em !important; }
.mt5em { margin-top:5em !important; }
.mt5_5em { margin-top:5.5em !important; }

/* margin : bottom */
.mb0em { margin-bottom:0em !important; }
.mb0_5em { margin-bottom:0.5em !important; }
.mb1em { margin-bottom:1em !important; }
.mb1_5em { margin-bottom:1.5em !important; }
.mb2em { margin-bottom:2em !important; }
.mb2_5em { margin-bottom:2.5em !important; }
.mb3em { margin-bottom:3em !important; }
.mb3_5em { margin-bottom:3.5em !important; }
.mb4em { margin-bottom:4em !important; }
.mb4_5em { margin-bottom:4.5em !important; }
.mb5em { margin-bottom:5em !important; }
.mb5_5em { margin-bottom:5.5em !important; }

body {
	min-width: 915px;
	color: #231815;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
a {
	color: #231815;
	text-decoration: none;
	transition-duration:0.3s;
}
a:visited {
	color: inherit;
}
a.hover:hover {
	opacity: 0.7;
}
a[href^="tel:"]:hover {
	color: inherit;
	cursor: default;
}
a img {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition-duration:0.3s;
}
a img:hover {
	opacity: 0.7;
}
#wrapper * {
	box-sizing: border-box;
}
#wrapper {
	font-size: 1.23em;
	line-height: 1.5;
	max-height: 100%;
}
#wrapper img {
	width: 100%;
	height:auto;
}
#wrapper .inner {
	width: 915px;
	margin-right: auto;
	margin-left: auto;
}
#wrapper .contentsInner {
	width: 810px;
	margin-right: auto;
	margin-left: auto;
}
#wrapper .sp {
	display: none;
}

/*非表示設定*/
.invisible {
	display: none;
}
.txtRed {
	color: #f00;
}

/* header
-----------------------*/
#header {
	width: 100%;
	background: #fff;
	border-bottom: solid 3px #000;
	font-size: 0.7em;
	position: fixed;
	z-index: 1;
	top: 0;
}
#header .inner {
	padding: 14px 0 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
#header .hdLogo {
	float: left;
	width: 13.1147540984%;
}
#header .menuBlock {
	float: right;
	width: 83%;
	text-align: center;
}
#header .menuBoxInner {
	display: flex;
	align-items: center;
}
#header .menuBlock .btnMenu {
	display: none;
}
#header .menuBox .menuLogo {
	display: none;
}
#header .menuBox .osakaBtn {
	width: 19%;
	display: flex;
	align-items: center;
	justify-content: center;
}
#header .menuBox .osakaBtn a {
	display: block;
	width: 100%;
	padding: 0.5em;
	background-image: url(../../common/img/icn_arrow06.png);
	background-repeat: no-repeat;
	background-color: #fff;
	background-position: 95% 50%;
	background-size: auto 40%;
	border: 2px solid #000;
}
#header .menuBox .osakaBtn a:hover {
	color: #fff;
	background-image: url(../../common/img/icn_arrow05.png);
	background-color: #000;
}
#header .menuBox ul {
	width: 81%;
}
#header .menuBox li {
	float: left;
}
#header .menuBox li a {
	display: block;
	padding: 4px 18px;
	position: relative;
}
#header .menuBox li a:before {
	content: "";
	display: block;
	position: absolute;
	border-top: solid 3px #ccc;
	top: -10px;
	left: 50%;
	width: 0px;
	height: 3px;
	margin-left: 0;
}
#header .menuBox li.cur a:before,
#header .menuBox li.hover a:before {
	width: 70px;
	transition: 0.5s;
	margin-left: -35px;
}
#header .menuBox li.cur a:after,
#header .menuBox li.hover a:after {
	content: "";
	display: block;
	position: absolute;
	border: 5px solid transparent;
	border-top: solid 5px #ccc;
	top: -7px;
	left: 50%;
	margin-left: -5px;
}
#header .menuBox li:nth-child(2) a:before {
	border-top: solid 3px #c0d4c8;
}
#header .menuBox li:nth-child(2) a:after {
	border-top: solid 5px #c0d4c8;
}
#header .menuBox li:nth-child(3) a:before {
	border-top: solid 3px #971e23;
}
#header .menuBox li:nth-child(3) a:after {
	border-top: solid 5px #971e23;
}
#header .menuBox li:nth-child(4) a:before {
	border-top: solid 3px #f0bd88;
}
#header .menuBox li:nth-child(4) a:after {
	border-top: solid 5px #f0bd88;
}
#header .menuBox li:nth-child(5) a:before {
	border-top: solid 3px #decaa6;
}
#header .menuBox li:nth-child(5) a:after {
	border-top: solid 5px #decaa6;
}
#header .menuBox li:nth-child(6) a:before {
	border-top: solid 3px #efa1a3;
}
#header .menuBox li:nth-child(6) a:after {
	border-top: solid 5px #efa1a3;
}
/*
#header .menuBox li:nth-child(5) {
	display: none;
}
*/

/* contents
-----------------------*/
#contents {
	margin-top: 58px;
	background: url(../../common/img/bg_img.jpg) bottom center no-repeat;
	background-size: 100%;
}
#contents .mainImgBlock {
	border-bottom: solid 3px #000;
}
#contents .mainImg {
	width: 915px;
	margin: 0 auto;
}
#contents .day {
	color: #e71f22;
}

/*snsBlock*/
#contents .snsBlock {
	margin-top: 150px;
	padding-bottom: 50px;
}
#contents .snsBox {
	position: relative;
	padding: 3px 20px;
	width: 48.8888%;
}
#contents .snsBox:before,
#contents .snsBox:after {
	position: absolute;
	top: 0;
	content: '';
	width: 22px;
	height: 100%;
	border-top: 1px solid #b2b0af;
	border-bottom: 1px solid #b2b0af;
}
#contents .snsBox:before {
	left: 0;
	border-left: 1px solid #b2b0af;
}
#contents .snsBox:after {
	right: 0;
	border-right: 1px solid #b2b0af;
}
#contents .snsBox {
	text-align: center;
}
#contents .snsBox dt {
	display: inline-block;
	margin-right: 10px;
	vertical-align: middle;
}
#contents .snsBox .note {
	font-size: 76%;
	margin-top: 0.4em;
}
/*
#contents .snsBox.follow {
	float: left;
}
#contents .snsBox.share {
	float: right;
}
*/
/*follow表示後削除*/
#contents .snsBox {
	height: 52px;
	margin: 0 auto;
}

#contents .snsBox.follow dt {
	width: 27.5280%;
}
#contents .snsBox.share dt {
	width: 18.5853%;
}
#contents .snsBox.follow dd,
#contents .snsBox.share dd {
	display: inline-block;
	padding-left: 1em;
	width: 10.4607%;
}
#contents .snsBox.follow dd img,
#contents .snsBox.share dd img {
	max-width: 30px;
}
#contents .snsBox .snsBoxInner {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

/*infoBlock*/
#contents .infoBlock {
	margin-top: 70px;
}
/*tourBox*/
#contents .infoBlock .tourBox {
	width: 70%;
	border: solid 2px #bfbfbf;
	background-color: #fff;
	padding: 1.8em 2.6em;
}
#contents .infoBlock .tourBox dt {
	font-size: 116%;
	font-weight: bold;
	padding-bottom: 0.5em;
	color: #d40000;
}
/*addressBox*/
#contents .infoBlock .addressBox {
	width: 45%;
	margin-top: 30px;
	background-color: #f0f0f0;
	border: solid 2px #bfbfbf;
	padding: 1.8em 2.6em;
}
#contents .infoBlock .addressBox dt {
	font-weight: bold;
	padding-bottom: 0.5em;
}
#contents .infoBlock .addressBox dd {
	font-size: 90%;
}

/* footer
-----------------------*/
#footer {
	background-color: #000;
	margin-top: -1px;
}
#footer .inner {
	display: flex;
	justify-content: center;
	padding: 1em 0;
}
#footer .txt {
	color: #fff;
	text-align: center;
	font-size: 75%;
	display: flex;
	justify-content: center;
}
#footer .txt + .txt {
	margin-left: 4em;
}
#footer .txt a {
	color: #fff;
	display: flex;
	align-items: center;
	position: relative;
	padding-right: 1em;
	transition: opacity 0.3s ease-out;
}
#footer .txt a::before,
#footer .txt a::after {
	content: "";
	display: block;
	position: absolute;
	right: 0;
	width: 0.5em;
	height: 1.5px;
	background: #fff;
	transform-origin: 90% 50%;
}
#footer .txt a::before {
	transform: rotate(45deg);
}
#footer .txt a::after {
	transform: rotate(-45deg);
}
#footer .txt a:hover {
	opacity: 0.7;
}


/*----------------------------
	SP用
------------------------------*/
@media only screen and (max-width: 768px) {
	body {
		min-width: inherit;
	}
	#wrapper {
		font-size: 1em;
	}
	#wrapper .inner {
		width: 100%;
	}
	#wrapper .contentsInner {
		width: 100%;
	}
	#wrapper .sp {
		display: block;
	}
	#wrapper .pc {
		display: none;
	}

	/* header
	-----------------------*/
	#header {
		border-bottom: none;
		background: #000;
		font-size: 1em;
		position: static;
	}
	#header .inner {
		padding: 18px 0 ;
	}
	#header .hdLogo {
		width: 35%;
		max-width: 177px;
		margin-left: 15px;
	}
	#header .menuBlock {
		float: none;
		height: 100%;
		width: 100%;
		transition: all 0.4s ease 0s;
	}
	#header .menuBlock.active {
		overflow: auto;
		top:0;
		left:0;
		position: fixed;
		background:rgba(256, 256, 256, 0.95) none repeat scroll 0 0;
		z-index: 1;
	}
	#header .menuBlock .btnMenu {
		display: block;
		position: fixed;
		top: 1%;
		right: 1%;
		padding: 1.5%;
		background: #000;
		z-index: 10;
	}
	#header .menuLink,
	#header .menuLink span {
		display: inline-block;
		transition: all 0.4s ease 0s
	}
	#header .menuLink {
		display: block;
		position: relative;
		width: 37px;
		height: 25px;
	}
	#header .menuLink span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #fff;
		border-radius: 3px;
		z-index: 10001;
	}
	#header .menuLink span:nth-of-type(1) {
		top: 0;
	}
	#header .menuLink span:nth-of-type(2) {
		top: 11px;
	}
	#header .menuLink span:nth-of-type(3) {
		bottom: 0;
	}
	#header .btnMenu.active {
		padding-right: 2%;
		background: rgba(256, 256, 256, 0) none repeat scroll 0 0;
	}
	#header .btnMenu.active .menuLink span {
		background-color: #000;
	}
	#header .btnMenu.active .menuLink span:nth-of-type(1) {
		-webkit-transform: translateY(11px) rotate(-45deg);
		transform: translateY(11px) rotate(-45deg);
	}
	#header .btnMenu.active .menuLink span:nth-of-type(2) {
		opacity: 0;
	}
	#header .btnMenu.active .menuLink span:nth-of-type(3) {
		-webkit-transform: translateY(-11px) rotate(45deg);
		transform: translateY(-11px) rotate(45deg);
	}
	#header .menuBox {
		opacity: 0;
	}
	#header .menuBoxInner {
		display: none;
		padding-top: 20%;
		padding-bottom: 7%;
	}
	#header .menuBlock.active .menuBox {
		transition: all 0.4s ease 0s;
		opacity: 1;
	}
	#header .menuBlock.active .menuBoxInner {
		display: block;
	}
	#header .menuBox .menuLogo {
		display: block;
		width: 60%;
		margin: 0 auto 2.5em;
	}
	#header .menuBox .osakaBtn {
		width: 80%;
		margin: auto;
		margin-top: 9%;
	}
	#header .menuBox .osakaBtn a {
		font-size: 1.5em;
	}
	#header .menuBox ul {
		width: 100%;
	}
	#header .menuBox li {
		float: none;
		font-size: 1.5em;
		padding: 0.8em 0;
	}
	#header .menuBox li:nth-child(1),
	#header .menuBox li:nth-child(2),
	#header .menuBox li:nth-child(3),
	#header .menuBox li:nth-child(4),
	#header .menuBox li:nth-child(5),
	#header .menuBox li:nth-child(6) {
		width: 100%;
	}
	/* contents
	-----------------------*/
	#contents {
		margin-top: 0;
	}
	#contents .mainImgBlock {
		border-bottom: solid 1px #000;
	}
	#contents .mainImg {
		width: 100%;
	}
	#contents .contentsInner {
		padding-left: 30px;
		padding-right: 30px;
	}
	/*snsBlock*/
	#contents .snsBlock {
		margin-top: 70px;
		padding-bottom: 35px;
	}
	#contents .snsBox {
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
/*
	#contents .snsBox.follow {
		float: none;
	}
	#contents .snsBox.share {
		float: none;
	}
*/
	#contents .snsBox {
		height: 60px;
	}
	#contents .snsBox.follow dd,
	#contents .snsBox.share dd {
		padding-left: 1.5em;
		width: 17.4440%;
	}
	#contents .snsBlock .share {
		margin-top: 22px;
	}

	/*infoBlock*/
	#contents .infoBlock {
		margin-top: 50px;
	}
	/*tourBox*/
	#contents .infoBlock .tourBox {
		width: 92%;
		margin-top: 50px;
		max-width: 440px;
		margin: 0 auto;
		border: solid 2px #bfbfbf;
		padding: 1.4em 2.2em;
	}
	/*addressBox*/
	#contents .infoBlock .addressBox {
		width: 92%;
		max-width: 370px;
		margin: 30px auto 0;
		background-color: #f0f0f0;
		border: solid 2px #bfbfbf;
		padding: 1.4em 2.2em;;
	}
	#contents .infoBlock .addressBox dt {
		font-size: 105%;
	}
	#contents .infoBlock .addressBox dd {
		font-size: 100%;
	}

	/* footer
	-----------------------*/
	#footer .inner {
		flex-direction: column;
	}
	#footer .txt + .txt {
		margin-left: 0;
		margin-top: 1em;
	}
}
