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

/*　文書構造:
------------------------------------------------*/
/* セカンドページ
--------------------------------------------*/
#contents h1{
	position: relative;
    background: var(--gray3) url(../img/footer_line.gif) no-repeat 0 0;
    background-size: contain;
    padding: 3rem 0;
    text-align: center;
	margin-bottom: 2rem;
}
/*
#contents h1{
background: linear-gradient(
  135deg,
  rgba(0, 91, 65, 0.8),
  rgba(212, 175, 55, 0.8),
  rgba(192, 0, 7, 0.8)
);
	padding: 3rem 0;
	color: #fff;
	text-align: center;
	margin-bottom: 2rem;
	font-size: 2rem;
	line-height: 2.2rem;
}
*/
/*

#contents h2{
	background: #ddd;
	padding: 0.5rem 1rem;
	border-radius: 0 0 20px 0;
	margin-bottom: 2rem;
	font-size: 1.2rem;
	font-weight: 400;
}
*/
#contents h2 { margin: 0 0 1rem; }

#contents h2 span{
display: inline-block; /* 文字の幅＝要素幅 */
  padding-bottom: 0.15em;

  background-image: linear-gradient(
    135deg,
    rgba(0, 91, 65, 0.8),
    rgba(212, 175, 55, 0.8),
    rgba(192, 0, 7, 0.8)
  );
  background-repeat: no-repeat;
  background-size: 100% 0.1em; /* 下線の太さ */
  background-position: 0 100%;  /* 下端に配置 */
}

#contents h2.hotel{
	background: url("../img/hotel.svg") no-repeat center 0;
	background-size: 50px;
	text-align: center;
	padding: 3rem 0 0;
}
/*
#contents h2{
    font-family: var(--font-t);
    font-weight: 600;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--main);
    background: url("../img/common/se_page.gif") no-repeat 0 30%;
    background-size: 100%;
    padding: 0.8rem 0.8rem 0.7rem;
    margin-bottom: 1rem;
    border-top:solid 2px var(--accent);
    letter-spacing: 0.05em;
}
*/

#contents h3{
    position: relative;
    font-family: var(--font-t);
    font-size: 1.2rem;
    font-weight: 500;
    margin: 0 0 1rem 0;
    line-height: 1.8rem;
    padding: 0.7rem 1rem 0.5rem;
    background: var(--gray3);
    border-radius: 0 0 1rem 0;
}

#contents h4{
    font-family: var(--font-t);
    font-size: 1.1rem;
    font-weight: normal;
    margin: 0 0 1rem 0;
	border-bottom: 3px solid var(--main);
	padding: 0 1rem;
    display: inline-block;
}


/*-- 段落 --*/

#contents p{
    line-height: 1.6rem;
	margin-bottom: 1rem;
}

#contents p.p_indent{
    text-indent: 1rem;
}

/*---- align ----*/

.t_right{text-align: right;}
.center{text-align: center;}

/*---- color ----*/

.red{color: var(--red);}
.blue{color: var(--blue);}

/*---- bold ----*/

.bold{font-weight: 700;}


/*---- font-size ----*/

.fs9 {font-size: 0.9rem;}
.fs8 {font-size: 0.8rem;}

/*---- br ----*/

.sp_br{display: none;}
.pc_br{display: inline;}




/*---- lnk2 ----*/

#contents .lnk2 a,
#contents .lnk2 button{
    display: inline-block;
    text-decoration: none;
	border-radius: var(--radius);
    padding: 1rem 1.5rem;
    border: solid 1px var(--main);
    height: 100%;
	box-shadow: var(--shadow);
    background: #fff;
    font-size: 1rem;
}

#contents .lnk2 a:hover,
#contents .lnk2 button:hover{
	box-shadow: none;
	transform: translateY(2px);
    background: var(--gray3);
    color: var(--main);
}

/*---- lnk3 ----*/

#contents .lnk3 a{
	position: relative;
    display: inline-block;
    padding: 0 1rem 0 1.8rem;
}

#contents .lnk3 a:before{
	position: absolute;
    content: "";
	background-image: url("../img/common/arrow02.svg");
	width: 10px;
	height: 15px;
	top: 0.2rem;
	left: 0.5rem;
}

/*画像*/
img.border {border: 1px solid var(--gray3);}


#contents p,
#contents .list,
#contents .list_fl,
#contents .dl1,
#contents .dl2,
#contents .table1,
#contents .table2,
#contents .table3{
	margin: 0 0 1.5rem;
}

/* list
--------------------------------------------*/
ul.list li{
    padding:0 0 0.5rem 0;
}
ul.list.grid li{
    padding:0;
}


/*矢印アイコン*/
ul.pt1 li {
    background: url("../img/common/arrow02.svg") no-repeat 0.5rem 0.8rem;
    background-size: 10px;
    padding: 0.5rem 1rem 0.5rem 1.8rem;
/*    margin-bottom: 1rem;*/
}

#contents ul.pt1 li a {
    text-decoration: underline;
}

#contents ul.pt1 li a:hover {
    text-decoration: none;
}

/*矢印アイコンと枠*/
ul.pt2 li a {
    display: inline-block;
    text-decoration: none;
    padding: 1rem 1.5rem;
    border: solid 1px var(--main);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}
ul.grid.pt2 li a {
    margin-bottom: 0rem;
}
.list_fl {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
}

.list_fl_c {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 2rem;
}

ul.pt2.list_fl li a {
	margin-bottom: 0;
}

ul.pt2 li a:hover {
    box-shadow: none;
    transform: translateY(2px);
    background: var(--gray3);
}



ul.pt3 li a{
    display: inline-block;
    text-decoration: none;
	border-radius: var(--radius);
    padding:1rem 1.5rem;
    background: var(--main);
	box-shadow: var(--shadow);
	color: var(--white);
}

ul.pt3 li a:hover{
	box-shadow: none;
	transform: translateY(2px);
    background: var(--gray3);
    color: var(--main);
}


/*四角アイコン*/
ul.pt4 > li{
    position: relative;
	padding: 0 1rem ;
}
ul.pt4 > li:before {
    position: absolute;
    content: "";
    background: var(--main);
    width: 5px;
    height: 5px;
    top: 0.6rem;
    left: 0;
}

/*四角アイコン 入れ子*/

ul.pt4 li > ul.list_fl li {
	padding: 0;
}

ul.pt4 li > ul.list_fl li:before {
	content: none;
}

#contents ul.pt4 li a {
    color: var(--main);
    text-decoration: underline;
}

#contents ul.pt4 li a:hover {
    text-decoration: none;
    transition: 0.3s;	
}

/*olリストマーク設定*/

ol.list > li {
	padding-bottom: 0.5em;
}


ol.list.pt1 > li {
    list-style: none;
}

/* 数字用*/

#contents ol.list.pt2 {
	margin-left: 1.5rem;
}

ol.list.pt2 > li::marker {
    font-weight: bold;
	color: var(--main);
}


/*数字 入れ子*/

ol.list li > ul.pt4{
	padding-left: 1rem;
    padding-top: 0.5rem;
}

ul.list li > ol.pt1 {
	padding-top: 0.5rem;
}



/* dl
--------------------------------------------*/
.dl1 dt{
    color: var(--main);
    font-weight: bold;
}

.dl1 dd{
    margin: 0 0 1rem;
}

.dl2 dt{
    color: var(--main);
    font-weight: bold;
}
.dl2 dd{
    border-bottom: solid 1px var(--gray2);
    padding: 0 0 0.8rem 0;
    margin: 0 0 1rem;
}



/* table
--------------------------------------------*/

main .table1,
main .table3{
    border-collapse: collapse;
	border-left: 1px solid var(--gray2);
	border-top: 1px solid var(--gray2);
	width: 100%;
}

main .table1 th,
main .table3 th{
	background: var(--gray3);
	font-weight: 500;
}

main .table1 th,
main .table1 td{	
	border-right: 1px solid  var(--gray2);
	border-bottom: 1px solid  var(--gray2);
	padding: 0.8rem;
    text-align: left;
}

main .table3 th,
main .table3 td {
	border-right: 1px solid  var(--gray2);
	border-bottom: 1px solid  var(--gray2);
	padding: 0.8rem;
    text-align: center;
}

main .table1.center th {
	text-align: center;
}

main .table2{
    border-collapse: collapse;
	border-top: 1px solid var(--gray2);
	width: 100%;
}

main .table2 th{
	font-weight: 500;
}

main .table2 th,
main .table2 td{	
	border-bottom: 1px solid  var(--gray2);
	padding: 0.8rem;
    text-align: left;
}

main .table2.center th {
	text-align: center;
}

.sp_scroll .scroll_txt{display: none;}

/*---- hr ----*/

hr {display: none;}
hr.hr_line {
    display:block;
    width: 100%;
    height: 1px;
    border: 0;
    background: var(--gray2);
    margin: 1rem 0;
}

/*---- box ----*/

.box{
    padding: 1.5rem 1.5rem 0.1rem;
    margin-bottom: 1.5rem;
}

.box.border{
    border: 1px solid var(--gray2);
    margin-bottom: 1.5rem;
}
.box.b_red{
    background: var(--red2);
}

.box.b_red .box_in{
    border: solid 2px var(--red);
    background: var(--white);
    margin: 0 auto 1.5rem;
    position: relative;
    padding: 1rem 1rem 0.1rem;
}

/*---- youtube ----*/

.movie{
    margin: 0 auto 2rem;
    text-align: center;
}
.movie iframe{
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
	border: none;
}

/*---- google map ----*/
.map{margin-bottom: 3rem;}
.map iframe {
    width: 100%;
    height: 500px;
    filter: grayscale(100%);
    -webkit-filter: grayscale(80%);
	border: none;
}





@media screen and (max-width: 959px){
#contents h1 {
    font-size: 2rem;
    line-height: 2.4rem;
}

#contents h2 {
    font-size: 1.4rem;
    line-height: 1.9rem;
}

/*---- br ----*/
.sp_br{display: inline;}
.pc_br{display: none;}


/*---- box ----*/

.box{
    padding: 1rem;
}
.box .outline {
    padding: 0;
}
    
.box.b_red .box_in{
    margin: 0 auto;
}

/* table
--------------------------------------------*/
main .table1.block,
main .table2.block,
main .table1.block th,
main .table1.block td,
main .table2.block th,
main .table2.block td{
    display: block;
    width: 100%;
}

.table1 td,
.table1 th{
	padding: 0.7rem 0.7rem;
}


/* sp_scroll
--------------------------------------------*/
.sp_scroll {
    clear: both;
    overflow: auto!important;
    -webkit-overflow-scrolling: touch;
    border: 20px solid var(--red2);
    background: var(--red2);
    margin: 1rem 0;
}

.sp_scroll .scroll_txt {
    display: block;
    background: url("../img/common/icon_scroll.svg") no-repeat left 50%;
    background-size: 3rem;
    padding: 0.5rem 0 0.5rem 4rem;
}

.sp_scroll::-webkit-scrollbar{
 height: 5px!important;
}
.sp_scroll::-webkit-scrollbar-track{
 background: #fff!important;
}
.sp_scroll::-webkit-scrollbar-thumb {
 background: var(--red)!important;
}
.sp_scroll .table1,
.sp_scroll .table3{width: 700px;}
.sp_scroll .schedule_box{width: 959px;}

.sp_scroll .table1 td,
.sp_scroll .table2 td,
.sp_scroll .table3 td{background: #fff;}


/* grid
--------------------------------------------*/

.grid.off.clm2 {grid-template-columns: 1fr;}	
.grid.off.clm3 {grid-template-columns: 1fr;}
.grid.clm3_spclm2{grid-template-columns: repeat(2,1fr);}

.grid.clm2,
.grid.clm3,
.grid.off {
grid-gap: 1rem;
}

/*幅*/
.w50_sp100,
.w70_sp100,
.sp_w100{width: 100%;}

}