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

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, 
fieldset, input, textarea, p, blockquote, th, td{
    margin: 0; 
    padding: 0;
}
html{
	overflow-y: scroll;
	line-height:1.4em;
}
h1, h2, h3, h4, h5, h6{
    font-size: 100%; 
    font-weight: normal;
}
ol, ul{
    list-style:none;
}
li{
	list-style:none;
}
fieldset, img{
     border:0;
}
table{
    border-collapse: collapse; 
    border-spacing:0;
}
caption, th{
    text-align: left;
}
address, caption, cite, code, dfn, em, strong, th, var{
    font-style: normal; 
    font-weight: normal;
}
/* new clearfix */  
.clearfix:after {  
    visibility: hidden;  
    display: block;  
    font-size: 0;  
    content: " ";  
    clear: both;  
    height: 0;  
    }  
* html .clearfix             { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */  

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



#wrapper_sp {
	margin-left: auto;
    margin-right: auto;
    text-align: left;
	background-color: #A1C1C0;
}

#tokashiki_wrapper {
	background-image: url("../img/bg_main.jpg");
	background-repeat: no-repeat;
	background-color: #A1C1C0;
	background-position: center top;
	padding-bottom: 50px;
}

.content_sp {
	margin-left: auto;
    margin-right: auto;
	width: 990px;
}

.content_sp_b {
	margin-left: auto;
    margin-right: auto;
	width: 990px;
}

#tokashiki_head {
	text-align: center;
	padding-top: 30px;
}

@media screen and (max-width:990px) {
	#wrapper_sp {
	margin-left: auto;
    margin-right: auto;
    text-align: left;
	background-image:url(../img/bg_l.gif);
		width: 990px;
}


}

@media screen and (max-width:560px) {
	#wrapper_sp {
	margin-left: auto;
    margin-right: auto;
    text-align: left;
	background-image:url(../img/bg_l.gif);
		width: 990px;
}
	.content_sp {
	margin-left: auto;
    margin-right: auto;
	width: 990px;
}
	


}


/*/////////////////////////////ヘッダー////////////////////////////*/

.tokashiki_map {
	position: relative;
	padding-bottom: 30px;
	padding-top: 100px;
}

.tokashiki_map p {
	font-size: 14px;
}

.tour_gayou {
	font-size: 15px;
	color: #fff;
	position: absolute;
	top: 10px;
	left: 120px;
	text-align: center;
	width: 790px;
}

.tokashiki_txt {
	position: absolute;
	top: 510px;
	right: 40px;
	line-height: 1.5em;
}

.tokashiki_access {
	position: absolute;
	top:774px;
	left: 330px;
}

.tokashiki_access li {
	padding-bottom: 10px;
}

.tokashiki_access span {
	font-weight: bold;
	color: #0061A2;
}

.tokashiki_jouhou {
position: absolute;
	top:874px;
	left: 330px;	
}

.tokashiki_jouhou li {
	padding-bottom: 10px;
}

.new_travel_etiquette {
	position: absolute;
	top:970px;
	left: 330px;
	text-align: center;
}




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


}



/*///////////////////コンテンツ//////////////////*/


.tokashiki_contents {
	padding: 10px 0px 20px 70px; 
}
.tokashiki_contents li {
	float: left;
	padding-right: 10px;	
}

.tokashiki_specialists {
	background-image: url("../img/bg_guid.png");
	background-repeat: no-repeat;
	width: 950px;
	padding-top: 60px;
	margin-left: 30px;
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.tokashiki_specialists h2 {
	text-align: center;
}

.tokashiki_specialists p {
	text-align: center;
	font-size: 16px;
	padding: 20px 0px 30px 0px;
}

.tokashiki_specialists ul {
	padding-left: 15px;
}

.tokashiki_specialists li {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
}

.tokashiki_spots {
	background-image: url("../img/bg_spot.gif");
	width: 950px;
	margin-left: 30px;
	margin-bottom: 30px;
}

.tokashiki_spots h2 {
	text-align: center;
	padding: 60px 0px;
}

.spots_cas {
	padding-left: 50px;
	padding-bottom: 20px;
}

.kankou_spot {
	float: left;
	width: 270px;
	padding-right: 20px;
	padding-bottom: 30px;
}

.kankou_tit {
	text-align: center;
	font-size: 25px;
	color: #0061A2;
	font-weight: bold;
	padding-bottom: 20px;
}

.kankou_spot p {
	font-size: 15px;
	padding-top: 20px;
}

.tour_schedule {
	padding-top: 20px;
	padding-bottom: 30px;
}
.tour_schedule h2 {
	text-align: center;
	padding-bottom: 40px;
}


/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 950px;
  margin: 0 auto;}

/*タブのスタイル*/
.tab_item {
  width: calc(100%/3);
  height: 50px;
  border-bottom: 3px solid #5ab4bd;
  background-color: #d9d9d9;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 40px 40px 0;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #5ab4bd;
  color: #fff;
}

/*行程内容*/
.day01 {
	background-image: url("../img/day_01.jpg");
	background-repeat: no-repeat;
	width: 885px;
	height: 260px;
}

.day_tit {
	text-align: center;
	font-size: 22px;
	padding: 10px;
	font-weight: bold;
	color: #0061A2;
	border: 1px solid #0061A2;
	width: 100px;
    margin-left: 350px;
}

.day01 p {
	padding-left: 350px;
    padding-top: 60px;
    font-size: 20px;
    line-height: 2em;	
}

.stay_joho {
	background-color: #0061A2;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	padding: 10px;
	text-align: center;
	margin-bottom: 25px;
}

.day02_time {
	float: left;
	width: 450px;
}

.syukkou_img {
	float: left;
	padding: 20px 0px 0px 20px;
}

.day02_time {
}

.day02_time img  {
	float: left;
	
}

.syuppatsu {
	    float: left;
    font-size: 30px;
    padding-top: 40px;
    font-weight: bold;
    padding-left: 20px;
    width: 360px;
    height: 72px;
}

.day02_syukkou {
	color: #D00036;
	font-size: 18px;
}

.syukkou_txt {
	font-size: 15px;
	padding-top: 20px;
	padding-bottom: 20px;
}

.spot_setsumei {
	border-top: solid 1px #000;
	padding-top: 20px;
}

.day02_plan03 {
	background-image:url("../img/day02_03.jpg");
	height: 349px;
}

.tit03 {
	font-size: 30px;
	padding: 50px 0px 30px 20px;
}

.catch03 {
	color:#0D600F;
	font-size: 22px;
	padding-bottom: 30px;
	padding-left: 20px;
}

p.txt03 {
	font-size: 16px;
	width: 400px;
	padding-left: 20px;
}

.guide_link {
	padding-left: 500px;
}

.day02_plan04 {
	background-image:url("../img/day02_04.jpg");
	height: 368px;
}

.cafe_cont {
	float: right;
    width: 420px;
    padding-top: 30px;
}

.cafe_catch {
	font-size: 30px;
	color: #FF6600;
	padding-bottom: 20px;
    line-height: 1.5em;
}

.cafe_txt {
	font-size: 16px;
	padding-bottom: 20px;
}

.cafe_attention {
	padding-bottom: 20px;
	color: #BF1417;
}

.day02_plan05 {
	position: relative;
}

.machimai_title {
	font-size: 30px;
	position: absolute;
	top: 100px;
	left: 20px;
	line-height: 1.5em;
}

.machimai_txt {
	position: absolute;
	font-size: 16px;
	top: 380px;
	right: 0px;
}

.arakaki_txt {
	position: absolute;
    top: 830px;
    left: 70px;
    font-size: 14px;
}

.arakaki_txt span {
	color: #CD5400;
}

.day02_plan06 {
	position: relative;
}

.freetime_tit {
	position: absolute;
	top: 140px;
    left: 400px;
	font-size: 30px;
}

.freetime_txt {
	position: absolute;
	top: 200px;
	left: 400px;
	font-size: 18px;
}

.day02_plan07 {
	position: relative;
	font-size: 30px;
}

.dinner_tit {
	position: absolute;
	top: 30px;
	left: 250px;
}

.dinner_txt {
	position: absolute;
	top: 330px;
	left: 300px;
}

.day02_plan08 {
	position: relative;
	color: #fff;
	padding-bottom: 30px;
}

.night_tenbou {
	position: absolute;
	top: 70px;
	right: 30px;
}

.night_tenboudai_name {
	font-size: 30px;
	padding-bottom: 20px;
}

.night_tenbou p {
	padding-bottom: 20px;
}

.spot_setsumei_w {
	border-top: solid 1px #fff;
	padding-top: 20px;
}

.night_star {
	position: absolute;
	top: 440px;
	left: 30px;
}

.star_tit {
	font-size: 30px;
	padding-bottom: 20px;
}

.afterday_btn {
	text-align: center;
}


.tour_entry {
	background-color: #fff;
	border-radius: 10px;
}

.tour_entry h2 {
	background-color: #0061A2;
	color: #fff;
	text-align: center;
	font-size: 25px;
	font-weight: bold;
	padding: 30px 0px;
}

.tour_entry_02 {
	padding-top: 30px;
	padding-bottom: 30px;
}

.tour_ninzu {
	text-align: center;
}

.tour_entry_02 ul {
	padding-left: 110px;
    padding-top: 30px;
}

.tour_entry_02 li {
	float: left;
	padding-right: 15px;
	padding-bottom: 15px;
}


.day03_plan01 {
	position: relative;
}

.day03_plan01 p {
	position: absolute;
	top: 160px;
	right: 30px;
	font-size: 15px;
	width: 420px;
}

.day03_plan02 {
	position: relative;
}

.dp2_tit {
	position: absolute;
	top: 100px;
	left: 30px;
	font-size: 25px;
	font-weight: bold;
}

.day03_plan02 p {
	position: absolute;
	top: 140px;
	left: 30px;
	font-size: 15px;
	width: 340px;
}

.day03_plan03 {
	position: relative;
}

.dp3_tit {
	position: absolute;
	top: 30px;
	right: 270px;
	font-size: 25px;
	font-weight: bold;
}

.day03_plan03 p {
	position: absolute;
	top: 60px;
	right: 170px;
	font-size: 15px;
}


.day03_plan04 {
	position: relative;
}

.dp4_tit {
	position: absolute;
	top: 70px;
	left: 30px;
	font-size: 25px;
	font-weight: bold;
}

.day03_plan04 p {
	position: absolute;
	top: 100px;
	left: 30px;
	font-size: 15px;
}

.day03_plan05 {
	position: relative;
}

.dp5_tit {
	    position: absolute;
    top: 50px;
    right: 140px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day03_plan05 p {
	position: absolute;
    top: 130px;
    right: 35px;
    font-size: 15px;
    width: 280px;
}


.day03_plan06 {
	position: relative;
	padding-bottom: 30px;
}

.dp6_tit {
	    position: absolute;
    top: 40px;
    left: 35px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day03_plan06 p {
	position: absolute;
    top: 130px;
    left: 35px;
    font-size: 15px;
    width: 400px;
}


.day04_plan01 {
	position: relative;
	padding-bottom: 30px;
}

.dp41_tit {
	 position: absolute;
    top: 60px;
    left: 385px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day04_plan01 p {
	    position: absolute;
    top: 110px;
    left: 385px;
    font-size: 15px;
    width: 400px;
}

.beach_clean {
	position: absolute;
	top: 190px;
	left: 385px;
	color: #0B71B3;
	text-decoration: underline;
}

.day04_plan02 {
	position: relative;
	padding-bottom: 30px;
}

.dp42_tit {
	 position: absolute;
    top: 110px;
    left: 35px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day04_plan02 p {
	    position: absolute;
    top: 200px;
    left: 35px;
    font-size: 15px;
    width: 400px;
}

.day04_plan03 {
	background-image:url("../img/day04_03.jpg");
	background-repeat:no-repeat;
	height: 405px;
}


.day04_plan04 {
	position: relative;
	padding-bottom: 30px;
}

.dp44_tit {
	 position: absolute;
    top: 70px;
    left: 45px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day04_plan04 p {
	    position: absolute;
    top: 120px;
    left: 35px;
    font-size: 15px;
    width: 400px;
}

.shiryoukan {
	position: absolute;
    top: 230px;
    left: 35px;
    width: 320px;
	font-size: 13px;
}

.day04_plan05 {
	position: relative;
}

.dp45_tit {
	 position: absolute;
    top: 70px;
    left: 45px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day04_plan06 {
	position: relative;
}

.dp46_tit {
	 position: absolute;
    top: 60px;
    left: 415px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.dp47_tit {
	 position: absolute;
    top: 100px;
    left: 470px;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.5em;
}

.day04_plan07 {
	padding: 30px 0px;
}

.nahakou_touchaku {
	text-align: center;
	font-size: 30px;
	font-weight: bold;
}

.day05_plan01 {
	position: relative;
}

.dp51_tit {
	 position: absolute;
    top: 130px;
    left: 35px;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.5em;
}

.day05_plan02 {
	padding: 30px 0px;
}

.otsukaresama {
	font-size: 30px;
	text-align: center;
	color: #00387D;
	font-weight: bold;
}


@media screen and (max-width: 500px) {
  /* スマホ用のスタイル */
	
	.area_txte p {
	position: absolute;
	top: 380px;
    left: 260px;
	font-size: 70%;
		line-height: 1.2em;
	width: 670px;
}

}


.area_link_btn {
	text-align: center;
	padding: 30px 0px;
}

.area_s_btn {
	padding: 30px 0px 30px 80px;
}

.area_link_btn_s {
	float: left;
	padding-right: 30px;
}




/*/////////////////////////////　ページTOPボタン　////////////////////////////*/

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size:15px;
}
#page-top a {
	background:#7F6F08;
	text-decoration: none;
	color: #fff;
	width: 100px;
	padding: 30px 0;
	text-align: center;
	display: block;
	border-radius: 5px;
}
#page-top a:hover {
	text-decoration: none;
	background:#333;
}


/*/////////////////////////////　フッター　////////////////////////////*/

footer {
    text-align: left;
    position: relative;
}

footer ul {
    margin: 0 auto;
    padding: 0;
    font-size: 12px;
    line-height: 1.4;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 11px;
    right: 40px;
}

footer li {
    margin: 0 0 0 24px;
    padding: 0;
}

footer .copyright {
    background: #ececec;
    padding: 24px 40px;
    text-align: left;
    margin: 0 auto;
    font-size: 13px;
}

footer div {
    color: #fff;
    background: #445289;
    padding: 40px calc(50% - 450px);
    padding: 40px -webkit-calc(50% - 450px);
    display: flex;
    flex-wrap: wrap;
}

footer dl {
    margin: 0 0 16px 0;
    padding: 0;
    display: flex;
    align-items: center;
    width: 100%;
}

footer dd {
    font-size: 13px;
    margin: 0 12px 0 0;
    padding: 0;
}

footer dt {
    margin: 0 16px 0 0;
    padding: 0;
    font-size: 15px;
    font-weight: bold;
}

footer dd a {
    color: #fff;
    font-size: 100%;
    vertical-align: baseline;
    text-decoration: none;
    margin: 0;
    padding: 0;
}

@media screen and (max-width: 500px) {
  /* スマホ用のスタイル */
	
footer {
    text-align: left;
    position: relative;
	width: 990px;
}

}

/*/////////////////////違うタブテスト/////////////////*/


.tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0;
}
.tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: DeepSkyBlue;
  display: block;
  order: -1;
}
.tab-label {
  color: White;
  background: LightGray;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}
.tab-label:not(:last-of-type) {
  margin-right: 5px;
}
.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
	background-color: #fff;
}
/* アクティブなタブ */
.tab-switch:checked+.tab-label {
  background: DeepSkyBlue;
}
.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 15px;
  opacity: 1;
  transition: .5s opacity;
  box-shadow: 0 0 3px rgba(0,0,0,.2);
}
/* ラジオボタン非表示 */
.tab-switch {
  display: none;
}




