@charset "utf-8";
/* CSS Document */
#contentbox{
  width:100%;
  background:url("../img/ttl_bg.jpg") no-repeat center top #ecffaf;
  padding-bottom: 10px;
}
#contentbox #kvbox{
  width:960px;
  height:200px;
  margin:auto;
  position: relative;
}
#contentbox #kvbox img{
  display: block;
  position: absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  margin:auto;
  width:376px;
  height:166px;
}
#contentbox nav{
  width:100%;
  background: #8fbc02;
}
#contentbox nav>ul{
  width:960px;
  margin:auto;
  display: flex;
  justify-content: space-between;
}
#contentbox nav>ul li{
  width:50%;
  box-sizing: border-box;
  border-right:1px solid #FFF;
}
#contentbox nav>ul li:first-child{
  border-left:1px solid #FFF;
}
#contentbox nav>ul li a{
  display: block;
  position: relative;
  font-size:18px;
  font-weight:bold;
  color:#FFF;
  text-align: center;
  padding: 20px;
}
#contentbox nav>ul li a:after{
  content:"";
  background: url("../img/navi_arrow.png") no-repeat;
  background-size:contain;
  width:24px;
  height:10px;
  position: absolute;
  top:0;
  bottom: 0;
  right:2%;
  margin: auto;  
}
#contentbox nav>ul li:last-child a:after{
  content:"";
  background: url("../img/navi_arrow_side.png") no-repeat;
  background-size:contain;
  width:10px;
  height:24px;
  position: absolute;
  top:0;
  bottom: 0;
  right:3%;
  margin: auto;  
}
#contentbox nav>ul li a:hover{
  background:#a2d011;
}
#contentbox nav>ul li a .icon {
  display: inline-block;
  width: 110px;
  background: #f9ff61;
  padding: 3px 5px;
  margin-right: 10px;
  text-align: center;
  color: #ff2c62;
  font-size: 13px;
  font-weight: bold;
  vertical-align:text-top;
}
#contentbox nav>ul li:last-child a .icon {
  font-size: 12px;
}
section{
  width:960px;
  margin:20px auto 40px;
  padding: 20px;
  background:#FFF;
  box-sizing: border-box;
}
h2.head_ttl{
  font-size:24px;
  font-weight:bold;
  color:#555e7b;
  padding-bottom: 10px;
  border-bottom: 4px double #555e7b;
}
h2.head_ttl.double{
  padding-left: 80px;
  min-height: 70px;
  position: relative;
  padding-bottom: 0
}
h2.head_ttl.double:before{
  content: "";
  position: absolute;
  background: url("../img/icon_limite.png") no-repeat;
  background-size: contain;
  width:60px;
  height:60px;
  top:0;
  left:0;
}
h2.head_ttl.double>span{
  display: block;
  font-size:80%;  
}

h2.head_ttl.dep{
  font-size:24px;
  padding:5px 0 5px 50px;
  font-weight:bold;
  color:#555e7b;
  border-bottom: 4px double #555e7b;
  background: url("../img/icon_search.png") no-repeat 1% center #FFF;
  background-size:32px 32px;
}

h2.head_ttl small{
  display: block;
  font-size:50%;
  font-weight:normal;
}


.headbox{
  display: flex;
}
.headbox .photo{
  width:420px;
  height:235px;
  position: relative;
  overflow: hidden;
}
.headbox .photo img{
  position: absolute;
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  left: 50%;
  top: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
}
.headbox .info{
  flex:1;
  padding-right: 10px;
}
.headbox .info>p{
  margin-top: 10px;
  line-height: 1.6em
}
.headbox .info>p .onlytxt{
  font-weight:bold;
  color:#ff2c62;
}

.close-info{
  margin: 20px auto;
  border: 1px solid #C00;
  padding: 10px;
  color:#C00;
}
.close-info>small{
  font-size:12px;
}

.service{
  margin: 20px auto;
  border:2px solid #fcc5d3;
  padding: 20px;
}
.service>ul{
  display: flex;
  flex-wrap: wrap;
  justify-content:space-between;
  align-items:flex-start;
}
.service>ul li{
  width:calc(99%/3);
  margin-right:0.5%;
  margin-bottom: 10px;
  padding-left: 2em;
  text-indent: -1.5em;
  font-size:16px;
  font-weight:bold;
  color:#ff2c62;
  line-height: 1.2em;
  position: relative;
  box-sizing: border-box;
}
.service>ul li:nth-child(3n){
  margin-right: 0;
}
.service>ul li small{
  font-size:70%;
  color:#333;
  font-weight: normal
}
.service>ul li:not(:last-child):before{
  content:"";
  display: inline-block;
  background: url("../img/icon_check.png") no-repeat;
  background-size: contain;
  width:18px;
  height:15px;
  margin-right: 5px;
}
.service>ul li:last-child{
  font-size:14px;
  color:#333;
}
ul.caution_list li{
  font-size:12px;
}

.access{
  display: flex;
  margin: 20px auto;
}
.access .mapbox{
  width:420px;
  height:240px;
}
.access .accessinfo{
  flex: 1;
  margin-left: 20px;
}
.access .accessinfo>ul{
  margin:20px auto;
}
.access .accessinfo>ul li{
  margin-bottom: 10px
}
.access .accessinfo>ul li>dl.data dt{
  display: inline-block;
  width:5.5em;
  height:1.4em;
  border-right:2px solid #999999;
  margin-right: 0.8em;
  vertical-align: top;
  font-weight:bold;
}
.access .accessinfo>ul li>dl.data dd{
  display: inline-block;
  width:calc(100% - 8em)
}
.access .accessinfo>ul li:last-child{
  margin-bottom: 0;
  font-size:12px;
}

h3.shuttle_ttl{
  margin:20px auto;
  padding:20px;
  font-size:20px;
  font-weight:bold;
  color:#FFF;
  background: #8fbc02;
  clear: right;
}
h3.shuttle_ttl>span{
  font-size:80%;
  opacity: 0.7;
  display: inline-block;
  float:right
}
h3.shuttle_ttl.sun_shuttle{
  position: relative;
  padding-left: 80px;
}
h3.shuttle_ttl.sun_shuttle:before{
  content:"";
  background: url("../img/logo.png") no-repeat;
  background-size:contain;
  width:64px;
  height:64px;
  position: absolute;
  top:0;
  bottom:0;
  left:10px;
  margin: auto;
}

.shuttle_course{
  display: flex;
  justify-content:space-between;
  margin-bottom: 20px;
}
.shuttle_course .routebox{
  width:320px;
}
.shuttle_course ul.shuttle_time{
  flex:1;
  padding:0 20px;
  box-sizing: border-box;
}
.shuttle_course ul.shuttle_time li{
  border-bottom: 1px solid #999999;
  padding: 5px 0;
  font-size:13px;
  padding-left: 4em;
  text-indent: -2em;
}
.shuttle_course ul.shuttle_time li span{
  display: inline-block;
  color:#fe2c62;
  font-weight: bold;
  vertical-align: middle
}
.shuttle_course ul.shuttle_time li:first-child{
  font-size:18px;
  font-weight: bold;
  color:#555e7b;
  line-height: 1.0;
  padding-bottom: 10px;
  padding-left: 0;
  text-indent: 0;
}
.note{
  font-weight: bold;
  color:#fe2c62;
  border-bottom: none!important;
  text-indent: 0!important;
  padding-left: 0!important
}
.note_txt{
  font-weight: bold;
  color:#fe2c62;
  display: inline!important
}


h4.spot_ttl{
  margin: 20px auto;
  padding-bottom: 5px;
  font-size:20px;
  font-weight:bold;
  color:#555e7b;
  border-bottom: 4px double #555e7b;  
}
ul.spotbox{
  display: flex;
  justify-content: space-between
}
ul.spotbox li{
  flex: 1;
}
ul.spotbox li:first-child{
  margin-right: 20px;
}
ul.spotbox li>dl dd.spot_img{
  width:450px;
  height:240px;
  position: relative;
  overflow: hidden;
}
ul.spotbox li>dl dd.spot_img img{
  position: absolute;
  width: auto;
  height:auto;
  min-width: 100%;
  min-height: 100%;
  left: 50%;
  top: 35%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);  
}
ul.spotbox li>dl dd.spot_img .copy{
  display: block;
  position: absolute;
  bottom: 0;
  right:0;
  padding:3px;
  color:#FFF;
}
ul.spotbox li>dl dt h5{
  font-size:18px;
  font-weight: bold;
  color:#8fbc02;
  margin: 5px 0;
}
ul.spotbox li>dl dt h5:before{
  content:"";
  display: inline-block;
  background: url("../img/icon_spot.png") no-repeat;
  background-size: contain;
  width:15px;
  height:20px;
  vertical-align: middle;
  margin-right: 5px;
}

.attn_box{
  background: url("../img/attn_bg.png") repeat;
  margin:20px auto 0;
  padding:20px;
}
.attn_box>h4{
  font-size:18px;
  font-weight: bold;
  color:#555e7b;
}
.attn_box ul.attn_list{
  margin:10px auto 20px;
}
.attn_box ul.attn_list li{
 margin-bottom: 5px;
  position: relative;
  padding-left: 1em;
  text-indent: -0.7em;
}

.attn_box ul.attn_list li:before{
  content: "●";
  display: inline-block;
  color:#8fbc02;
  margin-right: 5px;
}

.attn_box ul.attn_list li.no_burette:before{
  content: "";
}

/***** ▼バスツアー *****/
p.bus_catch{
  margin: 5px auto;
  background-color: #FCDEDE;
  font-size:16px;
  font-weight:bold;
  color:#FC4946;
  text-align: center;
  line-height: 2.4
}

.coursebox{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 15px auto;
}
.coursebox h3.course_ttl{
  width:100%;
  margin-bottom: 10px;
  font-size:20px;
  font-weight:bold;
  color:#e5006e;
  position: relative
}
.coursebox h3.course_ttl>span{
  display: inline-block;
  background-color: #e5006e;
  font-size:14px;
  font-weight:bold;
  color:#FFF;
  text-align: center;
  padding: 0.3em;
  vertical-align: middle;
  margin-right: 0.3em;
}
.coursebox h3.course_ttl>span:last-child{
  position: absolute;
  top:0;
  right:0;
  margin-right: 0
}
.coursebox .course_item{
  width:470px;
}
.coursebox .course_item .course_sch{
  margin: 10px auto;
  padding: 0.5em;
  background-color: #F2FCD3
}
.coursebox .course_item .course_sch>p{
  font-size:14px;
  font-weight:bold;
  color:#8fbc02;
}
.coursebox .course_item .course_sch ul.sch_list>li{
  display: inline-block;
  margin-right: 0.3em;
  font-size:12px;
}
.coursebox .course_item .course_sch ul.sch_list>li:after{
  font-family: "Font Awesome 5 Free";
  content: '\f061';
  font-weight: 900;
  color:#8fbc02;
  margin-left: 0.3em
}
.coursebox .course_item .course_sch ul.sch_list>li:last-child:after{
  content:none;
}
.course_arrange{
  border:3px double #e5006e;
  font-size:16px;
  font-weight:bold;
  color:#e5006e;
  padding: 0.3em;
  text-align: center
}
.course_arrange>small{
  font-size:13px;
  display: block
}
.coursebox .course_ph{
  flex: 1;
  padding-left: 10px;
}
.coursebox .course_ph img{
  max-width: 100%
}
/***** ▲バスツアー *****/

section:last-child{
  background:none;
  padding:0
}
ul.dep_list{
  width:100%;
  margin:10px auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
ul.dep_list li{
  width:234px;
  background:#8fbc02;
  margin-bottom: 10px;
  margin-right: 8px;
  border-radius: 10px;
}
ul.dep_list li:nth-child(4n){
  margin-right: 0
}
ul.dep_list li a{
  display: block;
  padding:12px 8px;
  font-size:18px;
  font-weight:bold;
  color:#FFF;
  text-align: center;
  position: relative
}
ul.dep_list li a:after{
  content:"";
  background: url("../img/arrow_side.png") no-repeat;
  background-size: contain;
  width:11px;
  height:17px;
  position: absolute;
  top:32%;
  right:5%;  
}
ul.dep_list li a:hover{
  opacity: 0.7  
}

/*** //動画 ***/
.moviebox{
	text-align: center;
	width:100%;
	max-width: 420px;
	margin:0 auto 30px;
}
.youtube-movie-content {
	padding-top: 56.25%;
	position: relative;
	width: 100%;
}

.youtube-movie-content iframe {
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	top: 0;
	left: 0;
 }
/*** 動画// ***/