@charset "utf-8";

@media print {
    /* 紙媒体向けスタイル定義 */
    body { _zoom:60%; -webkit-print-color-adjust:exact; }
  }

/* 旅物語共通 2012 */

.clfix:before, .clfix:after	{ content:""; display:table; }
.clfix:after				{ clear:both; }
.clfix						{ zoom:1; } /* For IE 6/7 (trigger hasLayout) */
.Main #siteMain{
  font: 13px/1.22 arial,helvetica,clean,sans-serif;
}
#container { 
  width:710px;
  padding:0px;
  margin: 0 auto;
}
#siteMain		{ 
  padding:0; 
  width:710px;
  margin: 0;
  display:block;
}

/* 特集全体 */
#wrap			{ width:710px; padding:0; margin-bottom:10px;background:#efefef;}

/* ヘッダ */

#wrap #headArea	{
  padding:0;
  margin:0;
}
#wrap #headArea h2 { 
  margin:0; 
  padding:0; 
} /* 軍艦島 */
#wrap #headArea #hmap	{ 
  /*float:left; */
  width: 100%;
  height: auto;
  margin:0; 
  padding:0;
} /* 軍艦島 */

/* ナビ */
#wrap .fixed		{ position:fixed; top:0px; z-index:9999; box-shadow:0 1px 3px #666; } /* ナビ固定 */

/* カセット共通 */
#wrap #heritage 			{ width:710px; margin:0 0 10px 0; padding:0;}
#wrap #heritage h3			{ font-size:0px; line-height:100%; margin:0; padding:0; text-indent:-9999px; }
#wrap #heritage p.expl		{ float:left; width:290px; font-size:1em; line-height:170%; margin:0 0 15px 56px; padding:0; }
#wrap #heritage img.expl	{ float:right; margin:0 42px 15px 17px; border:none; }

#wrap #heritage .osusume a:link,
#wrap #heritage .osusume a:visited	{ color:#ac1e1c; text-decoration:underline; }
#wrap #heritage .osusume a:hover	{ color:#E33; }
#wrap #heritage .osusume dl,
#wrap #heritage .osusume dt			{ display: flex; justify-content: left; margin: 0; padding: 0; }
#wrap #heritage .osusume dt			{ width: 150px; height:100%; color:#fff; font-weight:bold; font-size:1.2em; text-align:center; }
#wrap #heritage .osusume dt.train	{ background:url(../../images/ico_train.gif) no-repeat; }
#wrap #heritage .osusume dt.air		{ background:url(../../images/ico_air.gif) no-repeat; }
#wrap #heritage .osusume dt.bus		{ background:url(../../images/ico_bus.gif) no-repeat; }
#wrap #heritage .osusume dd			{ padding:0; min-height:0; line-height:130%; }
#wrap #heritage .osusume dd h5		{ font-weight:bold; font-size:1.12em; margin:0; }
#wrap #heritage .osusume dd .sub	{ font-size:1em; font-weight:normal; margin:0; }


.js_KMicon_tokyo,
.js_rweb2404_KMicon_tokyo {
	max-width: 59px;
  margin-right: 5px;
}
.js_id_tokyo,
.js_rweb2404_id_tokyo {
  padding: 3px 13px;
  background: #65605a;
  border-radius: 4px;
}

.Main .imgAnnotation {
  color: #333;
  padding: 10px 0;
	font-size: 12.5px;
	text-align: right;
  background: #FFF;
}

/*▼レスポンシブ対応*/
#wrap #heritage > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#wrap #heritage p.expl,
#wrap #heritage img.expl
{
  float: none;
}
#wrap #heritage .osusume dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
	align-items: center;
	margin: 20px 15px 0;
}
.pagetop {
  right: calc(((100% - 1120px) / 2) + 25px);
  display: none;
  position: fixed;
  bottom: 46px;
  right: 5px;
  z-index: 20;
  background: #adadad;
  border-radius: 50%;
}
@media print, screen and (min-width: 1120px) {
  .pagetop {
    right: 7.9%;
  }
}
.pagetop a {
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -ms-flex;
  display: -webkit-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-justify-content: center;
  -webkit-justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.pagetop span {
  width: 15px;
  height: 15px;
  display: inline-block;
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  -webkit-transform: rotate(45deg) translate(2px, 2px);
  transform: rotate(45deg) translate(2px, 2px);
}
/*▲pagetop*/
@media print, screen and (min-width: 768px) {
  #wrap #headArea h2 {
    position: absolute;
    content: '';
    top:0;
    right:0;
    width:276px; 
    height:340px; 
    font-size:0px; 
    text-indent:-9999px; 
    background:url(../../images/header_02.jpg) no-repeat;
  }
  #wrap .stickyBar {
    list-style:none;
    width:710px;
    margin:0;
    height:68px;
    position: sticky;
    position: -webkit-sticky;
    top: 92px;
    z-index: 2;
    justify-content: center;
    align-items: center;
    background:#fff;
  }
  #wrap .stickyBar li 	{ float:left; }
  #wrap .stickyBar .ind	{ margin-left:10px; }
  
  #wrap .stickyBar .bg_dark {
    background-color: black;
    display: inline-block;
  }
  #wrap .stickyBar .bg_dark img {
    width: 350px;
    display: block;
    opacity: 0.7;
  }
  #wrap .stickyBar .bg_dark img:hover {
    opacity: 1.0;
  }
  #wrap #headArea {
    width:710px;
    height:340px;
    position: relative;
  }
  #wrap #headArea #hmap { 
    position: absolute;
    content: '';
    top:0;
    left:0;
  }
  #siteMain #headArea #hmap ul { 
    position: relative; 
    width:434px; 
    height:340px;
    background:url(../../images/header_01.jpg) no-repeat;
    margin: 0;
  }
  #wrap #headArea #hmap ul li      { position:absolute; }
  #wrap #headArea #hmap .map01	{ left: 178px; top: 292px;}
  #wrap #headArea #hmap .map02	{ left: 159px; top: 170px;}
  #wrap #headArea #hmap .map03	{ left: 76px; top: 282px;}
  #wrap #headArea #hmap .map04	{ left: 215px; top: 124px;}
  #wrap #headArea #hmap .map05	{ left: 219px; top: 266px;}
  #wrap #headArea #hmap .map06	{ left: 171px; top: 61px;}
  #wrap #headArea #hmap .map07	{ left: 20px; top: 124px;}
  #wrap #headArea #hmap .map08	{ left: 90px; top: 258px;}
  #wrap #headArea #hmap .map09	{ left: 230px; top: 249px;}
  #wrap #headArea #hmap .map10	{ left: 295px; top: 179px;}
  #wrap #headArea #hmap .map11	{ left: 7px; top: 49px;}
  #wrap #headArea #hmap .map12	{ left: 149px; top: 309px;}
  #wrap #headArea #hmap .map13	{ left: 367px; top: 54px;}
  #wrap #headArea #hmap .map14	{ left: 119px; top: 117px;}
  #wrap #headArea #hmap .map15	{ left: 324px; top: 108px;}
  #wrap #headArea #hmap .map16	{ left: 339px; top: 294px;}
  #wrap #headArea #hmap .map17	{ left: 267px; top: 232px;}
  #wrap #headArea #hmap .map18	{ left: 275px; top: 209px;}
  #wrap #headArea #hmap .map19	{ left: 12px; top: 306px;}
  #wrap #headArea #hmap .map20  { left: 8px; top: 153px;}
  
  #wrap #heritage > div {
    width: 710px;
    margin:0 0 30px 0;
    padding:112px 0 0 0;
    position: relative;
  }
  #wrap #heritage > div::after {
    position: absolute;
    content: '';
    background: url(../../images/bg_pagetop.jpg) no-repeat;
    bottom: -20px;
    left: 0;
    width: 100%;
    height: 30px;
    
  }
  #wrap #heritage > div img.expl {
    height: 100%;
  }
  /* カセット個別 */
  #wrap #heritage #shiretoko		{ background:url(../../images/bg_heritage01.jpg) no-repeat;  }
  #wrap #heritage #ryukyu			{ background:url(../../images/bg_heritage02.jpg) no-repeat;  }
  #wrap #heritage #iwamiginzan	{ background:url(../../images/bg_heritage04.jpg) no-repeat;  }
  #wrap #heritage #shirakawago	{ background:url(../../images/bg_heritage05.jpg) no-repeat;  }
  #wrap #heritage #atomicbombdome	{ background:url(../../images/bg_heritage07.jpg) no-repeat;  }
  #wrap #heritage #kyoto			{ background:url(../../images/bg_heritage08.jpg) no-repeat;  }
  #wrap #heritage #itsukushima	{ background:url(../../images/bg_heritage09.jpg) no-repeat;  }
  #wrap #heritage #hiraizumi		{ background:url(../../images/bg_heritage10.jpg) no-repeat;  }
  #wrap #heritage #mtfuji			{ background:url(../../images/bg_heritage11.jpg) no-repeat;  }
  #wrap #heritage #nara			{ background:url(../../images/bg_heritage12.jpg) no-repeat;  }
  #wrap #heritage #yakushima		{ background:url(../../images/bg_heritage16.jpg) no-repeat;  }
  #wrap #heritage #tomioka		{ background:url(../../images/bg_heritage18.jpg) no-repeat;  }
  #wrap #heritage #himeji			{ background:url(../../images/bg_heritage19.jpg) no-repeat;  }
  #wrap #heritage #kiisanchi		{ background:url(../../images/bg_heritage20.jpg) no-repeat;  }
  #wrap #heritage #shirakamisanchi{ background:url(../../images/bg_heritage21.jpg) no-repeat;  }
  #wrap #heritage #meiji			{ background:url(../../images/bg_heritage22.jpg) no-repeat;  }
  #wrap #heritage #nikko			{ background:url(../../images/bg_heritage23.jpg) no-repeat;  }
  #wrap #heritage #munakata			{ background:url(../../images/bg_heritage24.jpg) no-repeat;  }
  #wrap #heritage #koyasan			{ background:url(../../images/bg_heritage25.jpg) no-repeat;  }
  #wrap #heritage #nagasaki			{ background:url(../../images/bg_nagasaki.jpg) no-repeat;  }
  #wrap #heritage #kokuristuseiyo			{ background:url(../../images/bg_kokuritsuseiyo.jpg) no-repeat;  }
  #wrap #heritage #mozu			{ background:url(../../images/bg_mozu.jpg) no-repeat;  }
  #wrap #heritage #amami			{ background:url(../../images/bg_heritage28.jpg) no-repeat;  }
  #wrap #heritage #amamioyobi			{ background:url(../../images/bg_heritage26.jpg) no-repeat;  }
  #wrap #heritage #jomon			{ background:url(../../images/bg_heritage27.jpg) no-repeat;  }
  #wrap #heritage #iriomote			{ background:url(../../images/bg_heritage29.jpg) no-repeat;  }
  #wrap #heritage #tokunoshima			{ background:url(../../images/bg_heritage30.jpg) no-repeat;  }
  #wrap #heritage #okinawa_north			{ background:url(../../images/bg_heritage31.jpg) no-repeat; padding:116px 0 0 0; }
  
  #wrap #heritage .osusume			{  margin:0; padding:0 42px 10px 42px; background:url(../../images/bg_heritage.jpg) repeat-y; }
  #wrap #heritage .osusume dl			{ width:626px; }
  #wrap #heritage .osusume h4			{ margin:5px 0; padding:0; font-size:1px; text-indent:-9999px; height:30px; background:url(../../images/txt_osusume.jpg) no-repeat; }
  
  #wrap #heritage .osusume dd{
    width: 446px;
    margin: 0 0 0 10px;
  }
  .util-pc-hidden {
    display: none;
  }
}
@media print, screen and (max-width: 767px) {
  .Main {
    margin: 0 auto 130px;
  }
  #wrap {
    padding-bottom: 60px;
    margin-bottom: 60px;
  }
  #container,#siteMain,#wrap,#wrap #headArea,#wrap #heritage {
    width: 100%;
  }
  #container {
    max-width: 710px;
  }
  #wrap #headArea h2 {
    width: 100%;
    height: auto;
    font-size: 0px;
    text-indent: 0;
  }
  #wrap #headArea h2 .kv_sp {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #wrap #headArea h2 .kv_sp01 {
    width: 61%;
  }
  #wrap #headArea h2 .kv_sp02 {
    width: 39%;
  }
  .Main .imgAnnotation {
	  margin: 0 auto;
  }
  #wrap .current_unique_nav {
    font-family: "Noto Serif JP", serif;
    text-align: center;
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    height: 74px;
    position: sticky;
    left: 0;
    right: 0;
    z-index: 20;
  }
  #wrap .current_page {
    font-size: 22px;
    font-weight: bold;
    padding: 10px;
  }
  #wrap .current_page.natural {
    background: #02650f;
  }
  #wrap .current_page.cultural {
    background: #010782;
  }
  #wrap .Wrap_spot--anc_trigger_button {
    padding: 5px 10px;
  }
  #wrap .Wrap_spot--anc_trigger_button.cultural {
    background: rgb(196,198,240);
    background: linear-gradient(180deg, rgba(196,198,240,1) 0%, rgba(139,144,217,1) 85%);
  }
  #wrap .Wrap_spot--anc_trigger_button.natural {
    background: rgb(186,217,185);
background: linear-gradient(180deg, rgba(186,217,185,1) 0%, rgba(99,197,105,1) 85%);
  }
  #wrap .Wrap_spot--anc_trigger_button span {
    position: relative;
  }
  #wrap .Wrap_spot--anc_trigger_button span::before {
    content: '';
    display: block;
    width: 0px;
    height: 0px;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    border-top: 8px solid #FFF;
    border-bottom: 0;
    position: absolute;
    top: 35%;
    left: -20px;
  }
  #wrap .Wrap_spot--anc_trigger_button.open span::before {
    border-top: 0;
    border-bottom: 5px solid #FFF;
  }
  #wrap .accordionTrigger02 {
    display: none;
  }
  #wrap .Wrap_spot--anc ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: flex-start;
    -ms-flex-pack: flex-start;
    justify-content: flex-start;
    flex-flow: row wrap;
    margin: 0;
  }
  #wrap .Wrap_spot--anc ul li {
    display: flex;
    width: 50%;
    border: 1px solid #ccc;
    position: relative;
  }
  #wrap .Wrap_spot--anc.natural ul li {
    background: rgb(231,252,230);
    background: linear-gradient(360deg, rgba(219,235,218,1) 0%, rgba(255,255,255,1) 100%);
  }
  #wrap .Wrap_spot--anc.cultural ul li {
    background: rgb(220,221,241);
background: linear-gradient(360deg, rgba(220,221,241,1) 0%, rgba(255,255,255,1) 100%);
  }
  #wrap .Wrap_spot--anc ul li:nth-of-type(n + 3) {
    border-top: none;
  }
  #wrap .Wrap_spot--anc ul li:nth-of-type(2n) {
    border-left: none;
  }
  #wrap .Wrap_spot--anc ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    color: #333;
    padding: 10px 15px 10px 30px;
  }
  #wrap .Wrap_spot--anc ul li::after {
    content: '';
    position: absolute;
    top: 36%;
    left: 0;
    display: inline-block;
    margin-left: 10px;
    width: 7px;
    height: 7px;
    border-top: 1px solid #aeaeae;
    border-right: 1px solid #aeaeae;
    -webkit-transform: rotate(135deg) translateY(-50%);
    transform: rotate(135deg) translateY(-50%);
  }
  #wrap #heritage {
    display: flex;
    flex-wrap: wrap;
    padding: 30px 0 0;
    margin: 0 auto;
  }
  #wrap #heritage > div {
    width: 100%;
    margin: 0 10px 20px;
    padding: 20px 0;
    background-size: 100% auto;
    background-color: #FFF;
    box-shadow: 0 1px 2px 2px rgba(0, 0, 0, .1);
  }
  #wrap #heritage > div h3 {
    color: #FFF;
    width: 100%;
    font-size: 18px;
    text-indent:0;
    padding: 10px 20px;
    background: rgb(98,95,90);
    background: linear-gradient(270deg, rgba(98,95,90,1) 0%, rgba(98,95,90,1) 63%, rgba(103,100,95,1) 75%, rgba(135,134,131,1) 91%, rgba(177,177,175,1) 100%);
    text-shadow: #444 2px 2px; 
    text-align: center;
  }
  #wrap #heritage > div p.expl,
  #wrap #heritage > div img.expl {
    width: 85%;
  }
  #wrap #heritage > div p.expl {
    margin: 20px auto 0;
  }
  #wrap #heritage > div img.expl {
    max-width: 304px;
    margin: 10px auto 0;
  }
  #wrap #heritage > div .osusume {
    width: 100%;
    background: none;
    margin: 20px 0 0;
    padding: 0;
  }
  #wrap #heritage > div .osusume h4 {    
    color: #FFF;
    font-size: 16px;
    font-weight: 800;
    margin: 0;
    padding: 10px 20px;
    background-color: #a51a1d;
    text-align: center;
  }
  #wrap #heritage > div .osusume dl {
    width: 85%;
    margin: 10px auto 0;
  }
	#wrap #heritage .osusume dt {
		width: 100%;
	}
  #wrap #heritage > div .osusume dd:last-of-type {
    border-bottom: none;
  }
  #wrap #heritage > div .osusume dd {
    width: 100%;
    padding-bottom: 10px;
    border-bottom: 1px solid #cdcdcd;
  }
  #wrap #heritage > div .osusume dt,
  #wrap #heritage > div .osusume dd {
    margin: 10px 0 0;
  }
  .stickyBar_sp {
    width: 100%;
    min-height: 60px;
    left: 0;
    right: 0;
    padding: 10px 0;
    height: auto;
    z-index: 20;
    background: rgba(60, 60, 60, 0.8);
    text-align: center;
  }
  .stickyBar_sp a img {
    width: 54%;
    max-width: 200px;
    margin: 0;
  }
  .util-sp-hidden {
    display: none;
  }
}
/*▲レスポンシブ対応*/
#wrap #heritage .osusume dd h5 .rweb2404{
    font-size: 1.4rem;
    font-weight: normal;
}
.ab_dom_feature{line-height: 1.6;}