@charset "UTF-8";
/* CSS Document */

@import url("common.css");

@media screen and (max-width: 680px) {

html {
	font-size: 100%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #575757;
}

body {
	width: 100%;
	position: relative
}

.tel_num {
	position: fixed;
	bottom: 19%;
	right: 4%;
	width: 60%;
	z-index: 5555;
	display: none;
}

.tel_num img {
	width: 100%;
}

/**********************************
ホバーの設定
**********************************/
a {
    color: #2d2d2d;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all  0.4s ease;
}
	
a:hover {
    color: #1a94c5;
}


a img {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all  0.7s ease;
}
	
a img:hover {
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}

/**********************************
ヘッダー
**********************************/
header h1 {
	font-size: 1rem;
	line-height: 1.5em;
	font-weight: 700;
	margin: 0.5rem 0 0 1rem;
	display: none;
}

header .logo {
	width: 90%;
	float: none;
	margin: 0.5rem 0 0.75rem 1rem;
	display: none;
}

header .logo img {
	width: 100%;
}

header .homebutton {
	width: auto;
	float: none;
	text-align: right;
}

header .homebutton img {
	width: 30%;
}
.nav {
	width: 100%;
	float: none;
	margin-top: 0.875rem;
	display: none;
}


.nav li {
	float: none;
	font-size: 1rem;
	font-weight: 700;
	text-align: center;
	margin:0;
	padding: 1rem 0;
	background-color: #cdcdcd;
	border: solid 1px #fff;
}

/************************
ナビの追加スタイル
*************************/
.nav2 {
	width: 100%;
	float: none;
	margin-top: 0.875rem;
	display: none;
}


.nav2 li {
	float: none;
	font-size: 1rem;
	font-weight: 700;
	text-align: center;
	margin:0;
	padding: 1rem 0;
	background-color: #cdcdcd;
	border: solid 1px #fff;
}

/**********************************
トップページ
**********************************/
/***1P****/
.contain1 {
	background-image: url(../img/top/top_bg1.png);
	background-position: center top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	min-height: 430px;
	padding-top: 6rem;
	padding-bottom: 2rem;
}

.contain1_text {
	width: 100%;
	text-align: center;
	font-size: 1.5rem;
	font-weight: 700;
	color: #fff;
	line-height: 2em;
	display: none;
}

.contain1_buttons {
	width: 100%;
	margin: 0;
}

.button1,
.button2 {
	float: none;
	width: 90%;
	display: none;
	margin: 4rem auto 0;
}
	
.button1 img,
.button2 img {
	width: 100%;
}

.next_button {
	width: 65%;
	margin: 5rem auto 3.5rem;
}

.next_button img {
	width: 100%;
}

.fadein {
	display: none;
}

/***2P***/
.contain2 {
	padding: 1.2rem 0 2rem 0;
}

.contain2 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	text-align: center;
	margin-top: 2rem;
	line-height: 2em;
}

.contain2 h3 {
	font-size: 1.2rem;
	text-align: center;
	line-height: 2em;
	font-weight: 700;
	margin-top: 2rem
}

.service_contain {
	margin-top: 2.5rem;
}

.service {
	width: 100%;
	float: none;
	margin-left: 0;
}

.service_text {
	margin-top: 1.5rem;
	line-height: 1.5em;
}

.service_more {
	margin-top: 2rem;
	text-align: right;
	font-size: 1.2rem;
	font-weight: 700;
}

/***3P***/
.contain3 {
	background-image: url(../img/top/top_bg2.png);
	background-position: center top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	min-height: 430px;
	padding: 4rem 0 2rem 0;
	position: static;
}

.contain3 h2 {
	text-align: center;
	font-weight: 700;
	font-size: 1.5rem;
	color: #fff;
}

.contain3 .contain3_text {
	text-align: center;
	color: #fff;
	font-size: 1.25rem;
	line-height: 2em;
	margin-top: 2.5rem;
}

.contain3 .contain3_more {
	width: 90%;
	margin: 2rem auto 0;
	position: static;
}

.contain3 .contain3_more img {
	width: 100%;
}

/***4P***/
.contain4 {
	background-image: url(../img/top/top_bg3.png);
	background-position: 10% top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	padding: 2rem 0 2rem 0;
	position: static;
}

.contain4 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	color: #a93939;
	width: 90%;
	margin-left: 0;
	text-align: center;
	line-height: 2em;
}

.contain4 .contain4_text {
	width: 90%;
	margin: 2rem auto 0;
	line-height: 2em;
	color: #fff;
	background-color: rgba(0,0,0,0.5);
}

.contain4 .contain4_button {
	position: static;
	width: 90%;
	margin: 4rem auto 0;
	background-color: rgba(255,255,255,0.7);
}

.contain4 .contain4_button img {
	width: 100%;
}

/***5P***/
.contain5 {
}

.contain5 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 2rem;
}

.contain5 table {
	width: 90%;
	border: solid 1px #a93939;
	margin: 2rem auto 0;
	float: none;
}

.contain5 table th {
	background-color: #ffcccc;
	padding: 1rem 0;
	width: 24%;
	font-weight: 700;
	border-bottom: dashed 1px #575757;
}

.contain5 table td {
	border-bottom: dashed 1px #575757;
	padding: 1.5rem;
	line-height: 1.5em;
}

.contain5 .inquiry {
	width: 80%;
	float: none;
	margin: 2rem auto 0;
}

.contain5 .inquiry span {
	line-height: 1.8em;
	font-size: 1rem;
	font-weight: 700;
	color: #f00;
}


.contain5 .inquiry img {
	width: 100%;
}

/**********************************
開業をお考えの方
**********************************/
/***1P***/
.contain6 {
	background-image: url(../img/kaigyou/kaigyou_bg1.png);
	background-position: center top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	min-height: 430px;
	padding-top: 8rem;
}

.contain6 .contain6_text {
	width: 100%;
	text-align: center;
	font-size: 1.2rem;
	font-weight: 700;
	color: #fff;
	line-height: 2em;
	display: none;
}

.contain6 .contain6_button {
	width: 100%;
	text-align: center;
	display: none;
}

.contain6 .contain6_button img {
	width: 90%;
	margin-top: 8rem;
}

/***2P***/
.contain7 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	text-align: center;
	margin-top: 2rem;
	line-height: 2em;
}

.contain7_text {
	float: none;
	width: 90%;
	margin: 2rem auto;
	line-height: 1.5em;
}

.contain7_image {
	width: 90%;
	float: none;
	margin: 2rem auto;
}

.contain7_image img {
	width: 100%;
}

/***3P***/
.contain8 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 2rem 0 0 2.5rem;
	line-height: 2em;
}

.contain8_text1 {
	text-align: right;
	font-weight: 700;
	color: #a93939;
	margin: 0.85rem 2.5rem 0 0;
}

.contain8_text2 {
	text-align: right;
	font-weight: 700;
	color: #3b5daa;
	margin: 0.85rem 2.5rem 0 0;
}

.contain8_image {
	width: auto;
	text-align: center;
	margin-top: 2rem;
}

.contain8_image img {
	width: 92%;
}
	
/***4P***/
.contain9 {
	background-image: url(../img/kaigyou/kaigyou_bg2.png);
	background-position: center top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	padding-top: 2rem;
	padding-bottom: 1.5rem;
	position: relative;
}

.contain9 h2 {
	font-size: 1.2rem;
	font-weight: 700;
	text-align: center;
	color: #fff;
	margin-top: 1.5rem;
	line-height: 1.5em;
}

.contain9_text {
	font-size: 1.125rem;
	line-height: 1.5em;
	text-align: left;
	color: #fff;
	margin: 1rem 0 0 1rem; 
}

.contain9 h3 {
	background-image: url(../img/kaigyou/squair.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	padding: 0 0 0.8rem 2.5rem;
	background-size: 1.5rem;
	color: #fff;
	font-size: 1.2rem;
	margin-top:2rem;
}

.contain9_list {
	margin-top: 1rem;
	width: 90%;
	margin: 0 auto;
}

.contain9_list_l {
	width: 100%;
	float: none;
	margin: 2rem auto;
}

.contain9_list_r {
	width: 100%;
	float: none;
}

.contain9_list_l p,
.contain9_list_r p {
	color: #fff;
	font-size: 1.125rem;
	margin-top: 4rem;
	line-height: 2em;
}


.contain9 ul {
	margin-left: 1.2rem;
}

.contain9 li {
	color: #fff;
	font-size: 1.125rem;
	margin-top: 1.125rem;
	list-style: disc;
}

.contain9_button {
	position: static;
	width: 100%;
	text-align: center;
}

.contain9_button img {
	width: 90%;
}

/***5P***/
.contain10 {
	min-height: 420px;
}

.contain10 h2 {
	font-size: 1.5rem;
	text-align: center;
	font-weight: 700;
	margin: 2rem 0 0 0;
	line-height: 2em;
}

.contain10 h3 {
	font-size: 1.125rem;
	font-weight: 700;
	margin-top: 3rem;
}

.contain10_text {
	width: 90%;
	float: none;
	margin: 0 auto;
}

.contain10_text p {
	margin-top: 1rem;
	line-height: 1.5em;
}
	
.totop2 {
	width: auto;
	text-align: center;
	padding: 0 2rem 0 0;
	margin-top: 2rem;
	cursor: pointer;
}

/**********************************
旅館等を運営されている方
**********************************/
/***1P***/
.contain11 {
	background-image: url(../img/ryokan/ryokan_bg1.png);
	background-position: center top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	padding-top: 8rem;
	min-height: 420px;
}

.contain11_text {
	width: 100%;
	text-align: center;
	font-size: 1.2rem;
	font-weight: 700;
	color: #fff;
	line-height: 2em;
	display: none;
}

.contain11_button {
	width: 100%;
	text-align: center;
	display: none;
}

.contain11_button img {
	width: 90%;
	margin-top: 4rem;
}

/***2P***/
.contain12 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	text-align: left;
	line-height: 1.5em;
	margin: 2rem auto 0 auto;
	width: 90%;
}

.contain12_text {
	float: none;
	width: 90%;
	margin: 2rem auto;;
	line-height: 2em;
}

.contain12_image {
	width: 90%;
	float: none;
	margin: 1rem auto;
}

.contain12_image img {
	width: 100%;
}

/***3P***/
.contain13 {
	background-image: url(../img/ryokan/ryokan_bg2.png);
	background-position: center top;
	background-repeat: no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	padding-top: 4rem;
}

.contain13 h2 {
	font-size: 1.5rem;
	font-weight: 700;
	width: auto;
	margin: 0;
	text-align: center;
	line-height: 2em;
	color: #fff;
}

.contain13 h3 {
	font-size: 1.125rem;
	font-weight: 700;
	margin-top: 3rem;
	color: #fff;
}

.contain13_text {
	width: 90%;
	float: none;
	margin-left: 0 auto;
	margin-bottom: 4rem;
}

.contain13_text p {
	margin-top: 1rem;
	line-height: 1.5em;
	color: #fff;
}

/***footer***/
.totop {
	width: auto;
	text-align: right;
	padding: 0 2rem 0 0;
	margin-top: 2rem;
	cursor: pointer;
}

footer {
	background-color: #c3c3c3;
	padding: 1.5rem 0;
}

footer .copyright {
	text-align: center;
	color: #fff;
	font-weight: 700;
}

/***本文中の装飾***/
.point {
	font-weight: 700;
}

}