@charset "UTF-8";
@import url("style.css");
/* CSS Document */

/*------------------------------
/*------------------------------
共通
------------------------------*/
/* ページタイトル*/
.page_title{
	font-family: "Rounded Mplus 1c";
	border-bottom: double 6px #008549;
	font-weight: 500;
	margin-bottom: 2.4rem;
	padding-bottom: 0.5rem;
}

/* パンくず*/
.breadcrumb {
  padding:0.8rem 0;
  margin-left:0;
  font-size: 1.6rem;
}
	
.breadcrumb li:first-child:before{
  content: '';/*何も入れない*/
  display: inline-block;/*忘れずに！*/
  width: 20px;/*画像の幅*/
  height: 17px;/*画像の高さ*/
  background-image: url(../images/mark@2x.png);
  background-size: contain;
  vertical-align: middle;
}

.breadcrumb li{
  display:inline;/*横に並ぶように*/
  list-style: none;
}

.breadcrumb li:after{/* >を表示*/
  content: '>';
  padding: 0 4px;
  color: #000000;
}

.breadcrumb li:last-child:after{
  content: '';
}

.breadcrumb li a {
    text-decoration: none;
    color: #000000;/*色*/
}

.breadcrumb li a:hover {
    text-decoration: underline;
	color: #008549;
}

/* 料金案内*/
.fee_table,.fee_table2{
	width: 100%;
	border-collapse: collapse;
	border: solid 2px #999999;
	margin: 3px auto;
}

.fee_table td.b_line,.fee_table2 td.b_line,.event_table1 td.b_line{
    border-top: solid 2px #999999;
}

.fee_li{
	width: 100%;
}

.fee_li li::before{
	content: "※";
	padding-right: 3px;
}

.fee_dl{
	width: 100%;
}

.fee_dl dt{
	color: #008549;
	margin-top: 10px;
	font-weight: 500;
}

.fee_dl dt::before{
	content: "・";
}

.fee_dl dd{
	margin-left: 3rem;
}

.tel_fax{
	margin-top: 1.2rem;
	padding-left: 3vw;
	font-weight: 700;
	font-family: "Rounded Mplus 1c";
	color: #194f00;
}

/* イベント*/
.event_month{
  font-family: "Rounded Mplus 1c";
  padding: 0 10px 0 20px;
  margin: 0 0 15px;;
  list-style-type: none;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #194f00), color-stop(0.00, #008549));
  background: -webkit-linear-gradient(#008549, #194f00);
  background: -moz-linear-gradient(#008549, #194f00);
  background: -o-linear-gradient(#008549, #194f00);
  background: -ms-linear-gradient(#008549, #194f00);
  background: linear-gradient(#008549, #194f00);
  border-radius: 8px;
  display: table;
}

.event_month li {
  display: inline-block;
  padding: 0;
  margin: 0;
  text-align: center;
  color: #fff;
  text-shadow: 0px -1px 1px rgba(0,0,0,0.7);
}

.event_month li a {
  width: auto;
  color: #fff;
  margin: 6px;
  padding: 5px 16px;
  text-decoration: none;
  display: block;
  border-radius: 8px;
}

.event_month li a:hover,.event_month li a.on {
  background: rgba(0,0,0,0.3);
  box-shadow: 1px 1px 3px rgba(255,255,255,0.5), 1px 1px 3px rgba(0,0,0,0.5) inset;
}

.event_month li:first-child {
  padding-right: 10px;
}

.event_midashi1{
	font-size: 2rem;
	font-weight: 600;
	background:#FFE0A3;
	padding: 5px 20px 5px 25px;
	position: relative;
	font-family: "Rounded Mplus 1c";
}

.event_midashi1::before {
position: absolute;
content: '';
top: 100%;
left: 0;
border: none;
border-bottom: solid 15px transparent;
border-right: solid 20px #FC6500;
}

.event_midashi2{
	font-size: 2rem;
	font-weight: 600;
	background:#dfefe6;
	padding: 5px 20px 5px 25px;
	position: relative;
	font-family: "Rounded Mplus 1c";
}

.event_midashi2::before {
position: absolute;
content: '';
top: 100%;
left: 0;
border: none;
border-bottom: solid 15px transparent;
border-right: solid 20px #008549;
}

.event_midashi3{
	font-size: 2rem;
	font-weight: 600;
	background:#C2DFFF;
	padding: 5px 20px 5px 25px;
	position: relative;
	font-family: "Rounded Mplus 1c";
}

.event_midashi3::before {
position: absolute;
content: '';
top: 100%;
left: 0;
border: none;
border-bottom: solid 15px transparent;
border-right: solid 20px #1273DF;
}

.event_day{
	font-size: 1.8rem;
	font-weight: 600;
	margin: 6px 0 8px;
	margin-left: 3.5rem;
	font-family: "Rounded Mplus 1c";
}

.event_txt{
	margin-bottom: 8px;
	margin-left: 3.5rem;
}

.event_table1,.event_table2{
	width: 100%;
	border-collapse: collapse;
	border: solid 2px #999999;
	margin: 3px auto;
}



.event_table1 th{
	white-space: nowrap;
	width: 33.3%;
}

.event_table2 th{
	white-space: nowrap;
	width: 16%;
}

.event_table2 td{
	padding:3px;
	border: solid 1px #CCCCCC;
    border-spacing: 0;
	text-align: left;
}

.toku{
    background:url("../villa/images/toku.png") top left no-repeat;
}

/* コース案内*/
#course_info{
	position: relative;
}

.coursr_pdf a{
	position: absolute;
	top:60px;
	right: 0px;
	display: block;
    padding: 8px;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
    line-height: 1.4;
}

.out_table{
	width: 100%;
	border-collapse: collapse;
	border: solid 2px #002f8b;
}

.in_table{
	width: 100%;
	border-collapse: collapse;
	border: solid 2px #b41f4a;
}

.summary_table{
	width: 100%;
	border-collapse: collapse;
	border: solid 2px #194f00;
	margin-bottom: 20px;
}

.couse_table{
	width: 100%;
	border-collapse: collapse;
	border: solid 2px #999999;
	margin: 20px auto;
}

.out_table th,.out_table td,.in_table th,.in_table td,.summary_table th,.summary_table td,.couse_table th,.couse_table td,.fee_table th,.fee_table td,.event_table1 th,.event_table1 td,.event_table2 th,.fee_table2 th,.fee_table2 td{
	padding:3px;
	border: solid 1px #CCCCCC;
    border-spacing: 0;
	text-align: center;
} 

.out_table th{
	background: #e6eaf3;
} 

.in_table th{
	background: #f6eaed;
}

.summary_table th{
	background: #ebf5ef;
}

.couse_table th,.fee_table th,.event_table1 th,.event_table2 th,.fee_table2 th{
	background: #eeeeee;
}

.couse_table td{
	width: 14.28%;
}

.out_midashi{
    color: #002f8b;
    font-family: "Rounded Mplus 1c";
	font-weight: 500;
	margin-bottom: 3px;
}

.in_midashi{
    color: #b41f4a;
    font-family: "Rounded Mplus 1c";
	font-weight: 500;
	margin-bottom: 3px;
	padding-top: 2rem;
}

.summary_midashi{
    color: #194f00;
    font-family: "Rounded Mplus 1c";
	font-weight: 500;
	margin-bottom: 5px;
	padding-left: 5px;
	border-left: 3px solid #c5ded1;
}

.corse_nav {
    width: 100%;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
	margin-bottom: 30px;
}

.corse_nav .corse_ul li a:hover {
    color: #ffffff;
	background: #008549;
}

.corse_nav .corse_ul li {
	text-shadow: 0px -1px 1px rgba(0,0,0,0.7);
}

.hole_nav .holenav1 li a span {
    font-weight: bold;
    font-size: 16px;
    font-size: 1.6rem;
}

img[usemap] {
    max-width: 100%;
    height: auto;
}

.o_course{
	border: 5px solid #e6eaf3;
	padding: 10px;
	text-align: center;
	margin-bottom: 15px;
}

.i_course{
	border: 5px solid #f6eaed;
	padding: 10px;
	text-align: center;
	margin-bottom: 15px;
}

.o_course h5,.i_course h5{
	font-size: 2rem;
	font-weight: 700;
}

.o_course h5 span,.i_course h5 span{
	font-size: 2.8rem;
}

.course_box{;
	width: 100%;
	margin-top: 20px;
}

.hole_nav {
    width: 100%;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
}

.hole_nav .holenav1 ,.hole_nav .holenav2 {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding: 8px 8px 8px 0
}

.hole_nav .holenav1 li,.hole_nav .holenav2 li {
    display: table-cell;
    padding-left: 7px;
    word-spacing: normal
}

.hole_nav .holenav1 li a {
    display: block;
    padding: 8px 0 8px;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    line-height: 1.3;
    background: #002f8b;
    border-bottom: 1px solid #ffffff;
    color: #fff;
    text-decoration: none !important;
	border-radius: 5px;
}

.hole_nav .holenav2 li a {
    display: block;
    padding: 8px 0 8px;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    line-height: 1.3;
    background: #b41f4a;
    border-bottom: 1px solid #ffffff;
    color: #fff;
    text-decoration: none !important;
	border-radius: 5px;
}

.hole_nav .holenav1 li a:hover,.hole_nav .holenav2 li a:hover {
    color: #ffec00;
}

.hole_nav .holenav1 li a span,.hole_nav .holenav2 li a span {
    font-weight: bold;
    font-size: 16px;
    font-size: 1.6rem;
}
	
.left_box{
	text-align: left;
}
	
.right_box{
	text-align: left;
}

.left_box img{
	width: 100%;
	height: auto;
}

/*　ちぐさ山荘*/
.villa_nav {
    width: 100%;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
	margin-bottom: 30px;
}

.villa_nav .villa_ul li {
	text-shadow: 0px -1px 1px rgba(0,0,0,0.7);
}

.villa_nav .villa_ul li a:hover {
    color: #ffffff;
	background: #008549;
}

img.kaso_image{
	width:100%;
	height: auto;
}

.room_info{
	width: 100%;	
}

.room_left img,.room_right img{
	width: 100%;
	height: auto;
}

.room_txt dt{
	width: 100px;
	float: left;
	border-top: 1px dotted #cccccc;
	padding: 6px 0;
}
	
.room_txt dd{
	margin-left: 100px;
	border-top: 1px dotted #cccccc;
	padding: 6px 0;
}

.fee_table2 th{
	white-space: nowrap;
	width: 20%;
}

.wifi_txt{
	margin-left: 15px;
	font-size: 1.6rem;
	color: #008549;
}

/* お問い合わせ*/
#thanks h3{
    background-color: #fff3eb;
	border-radius: 5px;
	padding: 2rem 1rem;
	text-align: center;
	color: #bf4d00;
}

#thanks p.thanks_tel{
	font-weight: 500;
	padding: 2rem 0;
	color: #008549;
	margin: 0 auto;
	text-align: center;
}

/* アクセス*/
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 10px;
height: 0;
overflow: hidden;
border: 0;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.access_dl{
	margin: 30px 0 20px;
}

.access_dl dt{
	font-weight: 500;
	color:#008549;
	margin-top: 1.4rem;
	font-size: 1.8rem;
}

.access_dl dd{
	padding-left: 1rem;
}

.access_dl dd:before{
	padding-left: 1rem;
	content: '・';
}

/* 企業情報*/
.company_dl{
	margin: 0 auto;
	width: 100%;
	font-size: 1.6rem;
	border-bottom : 1px solid #cccccc;
}

.company_dl dt{
	font-weight: 500;
	color:#008549;
	clear : both;
	width : 25%;
	float : left;
	border-top: 1px solid #cccccc;
	padding : 15px 0;
	text-align : right;
	overflow : hidden;
}

.company_dl dt:after{/* :を表示*/
  content: ':';
  padding-left: 5px;
  color: #008549;
}

.company_dl dd{
	padding-left: 1rem;
	width : 70%;
	float : right;
	border-top : 1px solid #cccccc;
	padding : 15px 0 15px 5%;
}

.company_dl dt:first-child,
.company_dl dt:first-child+dd{
	border : none;
}

/* プライバシーポリシー*/
ol.privacy_ol1{
	border: 2px solid #c5ded1;
	padding: 15px 15px 0 40px;
	margin-bottom: 3px;
}

 ol.privacy_ol1 li{
	margin-bottom: 15px;
	list-style-type: decimal;
	list-style-position: outside;
}

ol.privacy_ol2{
	margin-left: 3rem;
	padding-bottom: 20px;
}

ul.privacy_ul1,ul.privacy_ul2{
	margin-left: 2rem;
}

ol.privacy_ol2 li{
	margin-bottom: 15px;
	list-style-type :decimal;
	list-style-position: outside;
}

ol.privacy_ol2 li ul.privacy_ul1 li{
	margin: 5px 0;
	list-style-type:disc;
	list-style-position: outside;
}

ol.privacy_ol2 li ul.privacy_ul2 li{
	margin: 5px 0;
	list-style-type:lower-alpha;
	list-style-position: outside;
}

ol.privacy_ol2 li ul.privacy_ul2 li ul.privacy_ul1 li{
	margin: 5px 0;
	list-style-type:disc;
	list-style-position: outside;
}

/*------------------------------
/*------------------------------
1080px以上(pc)
------------------------------*/
@media screen and (min-width: 1080px){

/* ページタイトル*/
.page_title {
	font-size: 3rem;
}
	
p{
	font-size: 1.6rem;
}
	
/* 料金案内*/	
.fee1{
	position: absolute;
	right: 30px;
}

.fee1::before{
	content: "------";
	padding-right: 1rem;
}
	
.tel_fax{
	font-size: 3rem;
}
	
/* コース案内*/
.coursr_pdf a{
	font-size: 2rem;
}
	
.corse_nav .corse_ul {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding:0;
}

.corse_nav .corse_ul li {
    display: table-cell;
    padding-left: 7px;
    word-spacing: normal;
}
	
.corse_nav .corse_ul li:first-child {
    padding-left: 0px;
}

.corse_nav .corse_ul li a {
    display: block;
    padding: 8px 0 8px;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
	font-size: 2.4rem;
    line-height: 1.4;
}
	
.out_midashi,.in_midashi,.summary_midashi{
    font-size: 1.8rem;
}
	
.summarybox{
	width: 100%;
}
	
.left_box{
	float: left;
	width: 49%;
}
	
.right_box{
	float: right;
	width: 49%;
}
	
.course_box p{
	font-size:1.6rem;
}
	
/* ちぐさ山荘*/
.villa_nav .villa_ul {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding:10px 0;
}

.villa_nav .villa_ul li {
    display: table-cell;
    padding-left: 7px;
    word-spacing: normal;
}
	
.villa_nav .villa_ul li:first-child {
    padding-left: 0px;
}

.villa_nav .villa_ul li a {
    display: block;
    padding: 8px 0;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
	font-size: 1.8rem;
    line-height: 1.4;
}

.room_left{
	width: 390px;
	height: auto;
	float: left;
}
	
.room_right{
	width: 390px;
	float: right;
}
	
.room_txt{
	width: 390px;
	float: right;
	border-bottom: 1px dotted #cccccc;
}
	
/* お問い合わせ*/
#thanks{
	margin: 0 auto;
	padding: 40px 0px;
	text-align: left;
}
	
#thanks div{
	padding: 20px;
}
	
#thanks h3{
	font-size: 3rem;
	line-height: 1.6;
	font-weight: 500;
	margin-bottom: 3rem;
}	
	
#thanks p{
	font-size: 1.6rem;
	line-height: 1.8;
}
	
#thanks p.thanks_tel{
	font-size: 3.4rem;
}	
}

/*------------------------------
/*------------------------------
768−1079px(tablet)
------------------------------*/
@media screen and (min-width: 768px) and (max-width: 1079px) {
/* ページタイトル*/
.page_title {
	font-size: 2.8rem;
}
	
/* 料金案内*/	
.fee1{
	position: absolute;
	right: 20px;
}

.fee1::before{
	content: "------";
	padding-right: 1rem;
}
	
.tel_fax{
	font-size: 2.6rem;
}
	
/* コース案内*/
.coursr_pdf a{
	font-size: 2rem;
}
	
.corse_nav .corse_ul {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding: 0;
}

.corse_nav .corse_ul li {
    display: table-cell;
    padding-left: 7px;
    word-spacing: normal;
}

.corse_nav .corse_ul li:first-child {
    padding-left: 0px;
}

.corse_nav .corse_ul li a {
    display: block;
    padding: 8px 0;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
	font-size: 2rem;
    line-height: 1.4;
}	
	
.out_midashi,.in_midashi,.summary_midashi{
    font-size: 1.8rem;
}
	
.summarybox{
	width: 100%;
}
	
.left_box{
	float: left;
	width: 49%;
}
	
.right_box{
	float: right;
	width: 49%;
}
	
.course_box p{
	font-size:1.6rem;
}
	
.o_course img,.i_course img{
	width: 100%;
	height: auto;
}
	
/* ちぐさ山荘*/
.villa_nav .villa_ul {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding: 8px 8px 8px 0;
}

.villa_nav .villa_ul li {
    display: table-cell;
    padding-left: 7px;
    word-spacing: normal;
}
	
.villa_nav .villa_ul li:first-child {
    padding-left: 0px;
}

.villa_nav .villa_ul li a {
    display: block;
    padding: 8px 0;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    border-bottom: 1px solid #ffffff;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
	font-size: 1.6vw;
    line-height: 1.4;
}
	
.room_left{
	width: 49%;
	float: left;
}

.room_right{
	width: 49%;
	float: right;
}
	
.room_txt{
	width: 49%;
	float: right;
	border-bottom: 1px dotted #cccccc;
}
	
.room_txt dt{
	width: 100px;
	float: left;
	border-top: 1px dotted #cccccc;
	padding: 6px 0;
}
	
.room_txt dd{
	margin-left: 100px;
	border-top: 1px dotted #cccccc;
	padding: 6px 0;
}
	
/* お問い合わせ*/
#thanks{
	margin: 0 auto;
	padding: 40px 0;
	text-align: left;
}
	
#thanks div{
	padding: 15px;
}
	
#thanks h3{
	font-size: 2.8rem;
	line-height: 1.6;
	font-weight: 500;
	margin-bottom: 3rem;
}	
	
#thanks p{
	font-size: 1.6rem;
	line-height: 1.8;
}
	
#thanks p.thanks_tel{
	font-size: 3.2rem;
}
}

/*------------------------------
/*------------------------------
0-767px
------------------------------*/
@media screen and (max-width: 767px) {
	
/* パンくず*/
.breadcrumb {
	display: none;
}
	
/* レイアウト*/
main {
    padding-top: 15px;
}
	
/* ページタイトル*/
.page_title {
	font-size: 2.4rem;
}
	
/* 料金案内*/
.fee_table,.fee_table2{
	font-size:3vw;
	}
	
.fee1{
	position: absolute;
	right: 10px;
}

.fee1::before{
	content: "---";
	padding-right: 1rem;
}
	
.tel_fax{
	font-size: 5vw;
}

/* イベント*/
.event_table1,.event_table2{
	font-size:3vw;
}
	
/* コース案内*/
.coursr_pdf a{
	font-size: 1.7rem;
}
	
.corse_nav .corse_ul {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding: 8px 8px 8px 0
}

.corse_nav .corse_ul li {
    display:block;
    padding-left: 7px;
    word-spacing: normal;
	margin-bottom: 8px;
}

.corse_nav .corse_ul li a {
    display: block;
    padding: 8px 0 8px;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    border-bottom: 1px solid #ffffff;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
	font-size: 2.4rem;
    line-height: 1.4;
}	
	
.out_midashi,.in_midashi,.summary_midashi{
    font-size: 1.6rem;
}
	
.scroll{
	overflow: auto;
	white-space: nowrap;
}
	
.scroll::-webkit-scrollbar{
 	height: 5px;
}
	
.scroll::-webkit-scrollbar-track{
	background: #F1F1F1;
}
	
.scroll::-webkit-scrollbar-thumb {
 	background: #BCBCBC;
}
	
.hole_nav {
    width: 100%;
    border-top: none;
    border-bottom: none
}
	
.hole_nav .holenav1,.hole_nav .holenav2 {
    width: 100%;
    display: block;
    padding: 2px 1% 8px 0;
    word-spacing: normal;
    text-align: center
}
	
.hole_nav .holenav1 li,.hole_nav .holenav2 li {
    display: inline-block;
    padding-left: 1%;
    width: 31.333333%;
    padding-top: 6px
}
	
.hole_nav .holenav1 li a,.hole_nav .holenav2 li a {
    padding: 6px 0;
}
	
.course_box p{
	font-size:1.6rem;
}

.o_course img,.i_course img{
	width: 100%;
	height: auto;
}
	
.couse_table th,.event_table1 th,.event_table2 th{
	font-size:2.2vw;
}
	
/* ちぐさ山荘*/
.villa_nav .villa_ul {
    background: #ffffff;
    width: 100%;
    display: table;
    word-spacing: -1em;
    table-layout: fixed;
    padding: 8px 8px 8px 0;
}

.villa_nav .villa_ul li {
    display:block;
    padding-left: 7px;
    word-spacing: normal;
	margin-bottom: 8px;
}

.villa_nav .villa_ul li a {
    display: block;
    padding: 8px 0 8px;
    text-align: center;
    font-family: "Rounded Mplus 1c";
    background: #194f00;
    border-bottom: 1px solid #ffffff;
    color: #ffffff;
    text-decoration: none !important;
	border-radius: 5px;
	font-size: 2rem;
    line-height: 1.4;
}
	
.room_photo{
	width: 100%;
}
	
.room_photo img{
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}
	
.room_txt{
	width: 100%;
	border-bottom: 1px dotted #cccccc;
}
	
.room_txt dt{
	width: 100px;
	float: left;
	border-top: 1px dotted #cccccc;
	padding: 6px 0;
}
	
.room_txt dd{
	margin-left: 100px;
	border-top: 1px dotted #cccccc;
	padding: 6px 0;
}
	
/* お問い合わせ*/
#thanks{
		margin: 0 auto;
		padding: 20px 0;
		text-align: left;
}
	
#thanks div{
		padding: 10px;
}
	
#thanks h3{
		font-size: 5vw;
		line-height: 1.6;
		font-weight: 500;
	    margin-bottom: 3vw;
}	
	
#thanks p{
		font-size: 3vw;
		line-height: 1.8;
}
	
#thanks p.thanks_tel{
		font-size: 5vw;
}
	
	
	
}