@charset "UTF-8";
/* ### mixin.scss ### */
#pan { display: block; padding: 6px 4px; }

.logona { font-family: vdl-logona, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', sans-serif; }

.sp { display: none; }

.se { display: none; }

#contents { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif; line-height: 1.5; font-size: 20px; color: #3b1918; width: 100%; }
#contents section, #contents div, #contents p, #contents ul, #contents li, #contents dl, #contents dt, #contents dd, #contents table, #contents td { box-sizing: border-box; }

.btn_pagetop { width: 1080px; height: 0; position: fixed; left: 50%; bottom: 160px; margin-left: -450px; text-align: right; z-index: 1000; }
.btn_pagetop img { width: 100px; }

.mainVisual { position: relative; }
.mainVisual .mv { overflow: hidden; }
.mainVisual .mv h1 { width: 702px; position: absolute; top: 120px; left: 50%; margin-left: -12vw; z-index: 10; }
.mainVisual .mv h1 img { max-width: 100%; }
.mainVisual .mv h1 span { display: block; margin-top: -70px; text-align: right; font-size: 28px; color: #fff; }
.mainVisual .mv ul { height: 756px; }
.mainVisual .mv ul li { height: 756px; max-width: 100%; position: absolute; left: 50%; bottom: 0; top: 0; margin-left: -960px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.mainVisual .mv ul li:first-child { z-index: 1; }
.mainVisual .mv ul li:nth-child(n+3) { display: none; }
.mainVisual #anker { width: 960px; position: absolute; bottom: 0; left: 50%; margin-left: -489px; z-index: 10; }
.mainVisual #anker ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center; }
.mainVisual #anker ul li { background: url(../images/btn.png) no-repeat center top; background-size: cover; width: 19%; height: 175px; }
.mainVisual #anker ul li:hover { background: url(../images/btn_hover.png) no-repeat center top; background-size: cover; }
.mainVisual #anker ul li a { width: 100%; height: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; margin-top: -4px; text-align: center; font-size: 22px; }
.mainVisual #anker ul li a:hover { opacity: 1; text-decoration: none; }
.mainVisual #anker ul li span { color: #fff; }

.mainLead { background: url(../images/Introduction_bg.jpg) no-repeat center center; background-size: cover; overflow: hidden; }
.mainLead p { background: url(../images/Introduction_frame.png) no-repeat center center; background-size: cover; width: 760px; height: 230px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; margin: 136px auto; line-height: 1.8; font-weight: bold; text-align: center; font-size: 22px; color: #3b1918; }

#contents section { overflow: hidden; }
#contents section h2.logona { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; max-width: 100%; margin-bottom: 10px; font-size: 36px; color: #fff; }
#contents section h2.logona img { margin-right: 6px; }

#knowledge .Cont { background: #3b1918 url(../images/img_gaudi.png) no-repeat 66% bottom; padding: 70px 0; }
#knowledge .Cont h2 { display: block; text-align: left; width: 765px; margin: 0 auto; }
#knowledge .Cont p { width: 765px; margin: 0 auto; font-weight: bold; font-size: 18px; line-height: 1.7; color: #fff; }
#knowledge .period { background: #e57f13 url(../images/img_sagrada_família.png) no-repeat 38% bottom; padding: 105px 0; }
#knowledge .period h2 { color: #3b1918 !important; }
#knowledge .period p { font-size: 16px; color: #3b1918; }

#feature, .bgImage { background: url(../images/feature_bg.jpg) repeat 0 0; }
#feature .bgLine, .bgImage .bgLine { background-image: url(../images/line_deco_L.png), url(../images/line_deco_R.png); background-repeat: repeat-y, repeat-y; background-position: 0 0, right 0; width: 1223px; margin: 0 auto; }
#feature .Cont .Inner, .bgImage .Cont .Inner { width: 960px; margin: 0 auto; }
#feature h2, .bgImage h2 { position: relative; margin-top: 25px; padding: 80px 0; color: #e57f13 !important; }
#feature h2:before, .bgImage h2:before { background: url(../images/ttl_frame_top.png) no-repeat center top; content: ""; width: 100%; height: 75px; display: block; position: absolute; top: 0; left: 0; }
#feature h2:after, .bgImage h2:after { background: url(../images/ttl_frame_bottom.png) no-repeat center bottom; content: ""; width: 100%; height: 75px; display: block; position: absolute; bottom: 0; left: 0; }
@media all and (-ms-high-contrast: none) { #feature h2 img, .bgImage h2 img { margin-top: -15px; } }

#feature .Cont { overflow: hidden; padding-bottom: 10px; }
#feature .Cont .Inner { width: 914px; margin: 0 auto; padding-bottom: 20px; }
#feature .Cont h3 { margin-bottom: 20px; font-size: 36px; color: #3b1918; }
#feature .Cont h3 span { font-weight: normal; font-size: 24px; }
#feature .Cont ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap: wrap; }
#feature .Cont ul li { position: relative; width: 208px; margin: 0 0 22px 22px; line-height: 0; cursor: pointer; overflow: hidden; }
#feature .Cont ul li:nth-child(4n+1) { margin-left: 0; }
#feature .Cont ul li .photo { min-width: 208px; min-height: 208px; }
#feature .Cont ul li .photo:before { background: rgba(0, 0, 0, 0.5); content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 50%; z-index: 1; margin-left: -104px; min-width: 208px; }
#feature .Cont ul li img { width: 208px; margin-left: -104px; left: 50%; position: absolute; }
#feature .Cont ul li.on .photo:before { content: none; }
#feature .Cont ul li .caption { width: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: flex-end; position: absolute; bottom: 0; left: 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: flex-end; overflow: hidden; padding: 0 10px 10px 0; font-size: 16px; line-height: 1; color: #fff; z-index: 10; }
#feature .Cont ul li .caption:before { background: #fff; width: 82%; height: 1px; content: ""; display: block; margin: 7px 5px 0 -100px; }
#feature .Cont ul .modal { display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 1010; line-height: 1.5; }
#feature .Cont ul .modal > div { background: rgba(0, 0, 0, 0.9); width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 100; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; }
#feature .Cont ul .modal .box { background: url(../images/feature_bg.jpg) repeat 0 0; width: 750px; height: 500px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; position: relative; padding: 25px; }
#feature .Cont ul .modal .box:before { content: "×"; position: absolute; top: -60px; right: -40px; font-size: 40px; color: #eee; cursor: pointer; }
#feature .Cont ul .modal .box .photo { min-width: auto; }
#feature .Cont ul .modal .box .photo img { width: auto; margin-left: 0; left: 0; position: inherit; }
#feature .Cont ul .modal .box .subject { padding-bottom: 10px; text-align: center; font-size: 30px; color: #2a505d; }
#feature .Cont ul .modal .box .subject span { display: block; font-size: 24px; }
#feature .Cont ul .modal .box .detail { background-image: url(../images/element_L.png), url(../images/element_R.png), url(../images/element_bg.png); background-repeat: no-repeat, no-repeat, repeat; background-position: 0 bottom, right 1px, 0 0; padding: 40px 25px; font-size: 16px; }
#feature .Cont ul .modal .box .detail .note { padding-top: 30px; font-weight: bold; font-size: 16px; }

#access { background: url(../images/access_bg.png); }
#access .Cont { background-image: url(../images/access_frame_L.png), url(../images/access_frame_R.png); background-repeat: no-repeat, no-repeat; background-position: calc(50% - 1098px) 0, calc(50% + 1098px) 0; padding: 40px 0 10px; }
#access h2 { margin-bottom: 45px !important; color: #e57f13 !important; }
@media all and (-ms-high-contrast: none) { #access h2 img { margin-top: -15px; } }
#access .Inner { width: 730px; margin: 0 auto; }
#access .Inner dl { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap: wrap; }
#access .Inner dl dt, #access .Inner dl dd { padding-bottom: 40px; }
#access .Inner dl dt { width: 80px; text-align: center; margin-top: 5px; }
#access .Inner dl dt img { max-width: 75px; }
#access .Inner dl dd { width: calc(100% - 80px); padding-left: 20px; font-size: 16px; box-sizing: border-box; }
#access .Inner dl dd h3 { padding-bottom: 5px; font-size: 24px; color: #11a6ad; }
#access .Inner dl dd p { letter-spacing: -1px; }

.photo_forest p { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; overflow: hidden; line-height: 0; }
.photo_forest img { min-width: 1280px; width: 100%; }

#ticket .Cont { overflow: hidden; }
#ticket .Cont .Inner { width: 620px; }
#ticket .Cont .Inner { width: 864px; margin: 0 auto; overflow: hidden; }
#ticket h2 { flex-wrap: wrap; margin: 40px auto 20px !important; }
#ticket h2 span { width: 100%; display: block; text-align: center; font-size: 24px; }
@media all and (-ms-high-contrast: none) { #ticket h2 img { margin-top: -15px; } }
#ticket .lead { padding-bottom: 30px; font-size: 16px; }
#ticket h3 { margin-bottom: 30px; text-align: center; font-size: 30px; letter-spacing: 1px; color: #2a505d; }
#ticket .reserve, #ticket .choice, #ticket .today { background-color: #fff; background-image: url(../images/element_L.png), url(../images/element_R.png); background-repeat: no-repeat, no-repeat; background-position: left bottom, right top; overflow: hidden; margin-bottom: 50px; padding: 50px 0; }
#ticket .reserve h3, #ticket .choice h3, #ticket .today h3 { margin-bottom: 15px; }
#ticket .reserve .lead, #ticket .choice .lead, #ticket .today .lead { text-align: center; }
#ticket .reserve .figure { padding: 0 24px; }
#ticket .reserve .figure li { background: url(../images/howto_base.png) no-repeat 0 0; width: 450px; height: 450px; float: left; position: relative; margin-top: -160px; padding: 100px 50px 0 60px; clear: both; }
#ticket .reserve .figure li:after { content: url(../images/icon_arrow_R.png); position: absolute; bottom: 25px; right: 0; z-index: 10; }
#ticket .reserve .figure li h4 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; font-size: 20px; color: #11a6ad; }
#ticket .reserve .figure li h4 span { width: 40px; display: inline-block; margin-right: 5px; }
#ticket .reserve .figure li p { padding-bottom: 18px; font-size: 16px; }
#ticket .reserve .figure li p a { font-size: 16px; text-decoration: underline; }
#ticket .reserve .figure li .icon { text-align: center; }
#ticket .reserve .figure li:first-child { margin-top: 0; }
#ticket .reserve .figure li:nth-of-type(even) { padding: 165px 40px 0 50px; float: right; }
#ticket .reserve .figure li:nth-of-type(even):after { content: url(../images/icon_arrow_L.png); position: absolute; bottom: 25px; right: inherit; left: 0; z-index: 10; }
#ticket .reserve .figure li:last-child:after { content: none; }
#ticket .choice { padding: 50px 24px 100px; }
#ticket .choice h4 { background: #3b1918; width: 815px; height: 186px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; position: relative; margin-bottom: 50px; text-align: center; line-height: 1.8; border-radius: 18px; font-weight: normal; font-size: 16px; color: #fff; }
#ticket .choice h4 strong { font-size: 30px; }
#ticket .choice h4:after { content: ""; display: block; position: absolute; bottom: -60px; left: 50%; margin-left: -30px; border: 30px solid transparent; border-top: 30px solid #3b1918; }
#ticket .choice .list { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; }
#ticket .choice .list dt, #ticket .choice .list dd { margin-bottom: 24px; }
#ticket .choice .list dt { width: 200px; line-height: 0; }
#ticket .choice .list dd { width: calc(100% - 200px); padding-left: 20px; font-size: 16px; }
#ticket .choice h5 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; margin-bottom: 15px; font-size: 24px; color: #11a6ad; }
#ticket .choice h5 img { margin-right: 10px; }
#ticket .choice h5 + p { font-weight: bold; }
#ticket .choice small { font-size: 13px; }
#ticket .choice .btn_site { display: inline-block; float: right; }
#ticket .choice .btn_site a { background: #2a505d; display: block; padding: 10px 20px; font-weight: bold; font-size: 14px; color: #fff; text-decoration: none; }
#ticket .choice .btn_site img { width: 14px; vertical-align: middle; }
#ticket .choice .notice { background: #11a6ad; width: 815px; height: 145px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; position: relative; text-align: center; border-radius: 18px; font-weight: normal; font-size: 16px; color: #fff; }
#ticket .choice .notice strong { font-size: 21px; }
#ticket .today .lead { padding: 0 20px 0; font-size: 14px; }
#ticket .today .lead strong { font-size: 12px; }

#tour { padding-bottom: 80px; }
#tour h2 { flex-wrap: wrap; margin: 40px auto 20px !important; }
@media all and (-ms-high-contrast: none) { #tour h2 img { margin-top: -15px; } }
#tour .Inner { width: 864px; background: #ffffff; background-image: url(../images/element_L.png), url(../images/element_R.png); background-repeat: no-repeat, no-repeat; background-position: left bottom, right top; overflow: hidden; padding: 80px 3%; margin: auto; }
#tour .button { color: #ffffff; background: #2A505D; padding: 10px; text-align: center; width: 80%; font-weight: bold; margin: 0 auto; border-radius: 8px; }
#tour .tourColumn { margin: 0 auto; max-width: 864px; display: -webkit-box; display: -ms-flexbox; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: distribute; justify-content: space-around; flex-wrap: wrap; }
#tour .tourColumn__item { max-width: 340px; width: 50%; font-size: 16px; border: 1px solid #555; padding-bottom: 20px; }
#tour .tourColumn__item__img img { width: 100%; height: 200px; object-fit: cover; }
#tour .tourColumn__item__inner { padding: 10px; }
#tour .tourColumn__item .point { margin-bottom: 5px; }
#tour .tourColumn__item a { text-decoration: none; }
#tour .tourColumn__item .title { border-top: 1px solid #555; }
#tour .tourColumn__item .departures { display: inline-block; border: 1px solid #555; border-top: 0; padding: 5px 10px; font-weight: bold; }
#tour .tourColumn__item .day { display: inline-block; font-weight: bold; }
#tour .tourColumn__item .price { font-weight: bold; }
#tour .tourColumn__item h3 { font-size: 22px; font-weight: bold; }
#tour .tourColumn__item { position: relative; }
#tour .tourColumn__item .close { position: absolute; width: 100%; top: 10%; z-index: 2; text-align: center; }
#tour .tourColumn__item .close .exclamationIcon { display: inline-block; width: 25px; height: 25px; margin-right: 10px; }
#tour .tourColumn__item .close .closeText { display: inline-block; color: #f9423a; font-weight: bold; font-size: 15px; vertical-align: super; }
#tour .tourColumn__item .close + a .tourColumn__item__inner, #tour .tourColumn__item .close + a .tourColumn__item__button { opacity: 0.2; }
#tour .otherTour { max-width: 750px; margin: 40px auto 0; color: #fff; display: -webkit-box; display: -ms-flexbox; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: distribute; justify-content: space-around; flex-wrap: wrap; }
#tour .otherTour .button { width: 45%; color: #fff; font-size: 16px; }
#tour .otherTour a { color: #fff; text-decoration: none; }

.otherBtn { display: table; max-width: 680px; margin: 60px auto 0; position: relative; padding: 25px 0 50px; }
.otherBtn .button { display: table; width: 400px; margin: 0 auto; }
.otherBtn .button a { background-color: #F9423A; display: table-cell; text-align: center; font-weight: bold; color: #fff !important; font-size: 16px; border-radius: 5px; line-height: 1; height: 55px; border: none; vertical-align: middle; width: 100%; margin: 0; padding: 0; text-decoration: none; }

/* レスポンシブ対応 */
@media screen and (max-width: 1280px) { #contents div, #contents p, #contents table, #contents ul, #contents li, #contents dl, #contents dt, #contents dd { max-width: 100%; }
  .btn_pagetop { left: inherit; right: 40px; bottom: 120px; margin-left: 0; }
  .btn_pagetop img { width: 80px; }
  .mainVisual .mv h1 { width: 580px; top: 200px; }
  .mainVisual .mv h1 span { font-size: 23px; }
  #feature .Cont .Inner { width: 800px; }
  #feature .Cont ul li { width: 24%; margin: 0 0 10px 1.3%; }
  #ticket .Cont .Inner { width: 750px; }
  #ticket .reserve h3 { margin-bottom: 30px; }
  #ticket .reserve .figure li { background-size: cover; width: 400px; height: 400px; margin-top: -110px; padding: 90px 35px 0 50px; }
  #ticket .reserve .figure li h4 { align-items: center; font-size: 16px; }
  #ticket .reserve .figure li p { padding-bottom: 10px; font-size: 14px; }
  #ticket .reserve .figure li p a { font-size: 14px; text-decoration: underline; }
  #ticket .reserve .figure li .icon img { width: 80px; }
  #ticket .reserve .figure li:last-child .icon img { width: 120px; }
  #ticket .reserve .figure li:nth-of-type(even) { padding: 130px 40px 0 40px; }
  #ticket .choice h4 { width: 100%; font-size: 15px; }
  #tour .Inner { width: 750px; margin: 0 auto; } }
@media screen and (max-width: 1024px) { .btn_pagetop { width: 100%; }
  .mainVisual .mv h1 { width: 380px; left: inherit; right: 100px; margin-left: 0; top: 250px; }
  .mainVisual .mv h1 span { margin-top: -35px; font-size: 16px; }
  .mainVisual .mv ul { height: 650px; }
  .mainVisual #anker { width: 600px; margin-left: -300px; }
  .mainVisual #anker ul li { height: 140px; }
  .mainVisual #anker ul li a { font-size: 16px; }
  .mainLead p { width: 620px; height: 200px; margin: 80px auto; font-size: 19px; }
  #contents section h2.logona { font-size: 30px; }
  #knowledge .Cont h2.logona { max-width: 750px; width: calc(100% - 44px); }
  #knowledge .Cont p { max-width: 750px; width: calc(100% - 44px); }
  #feature .Cont, #ticket .Cont, #feature .Cont, #tour .Cont, .bgImage .bgLine { background-size: 40px; }
  #feature .Cont .Inner { max-width: 860px; width: 80%; }
  #feature .Cont ul li { height: 150px; }
  #feature .Cont ul li .caption { font-size: 13px; }
  #feature .Cont ul li .modal .photo { width: 50%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: center; overflow: hidden; }
  #feature .Cont ul li .modal .detail { width: 50%; }
  #feature .Cont ul li .photo.mt-3 { margin-top: -25px; margin-right: -5px; }
  #access .Cont { background-position: calc(50% - 1020px) 0, calc(50% + 1020px) 0; }
  #access .Inner { width: 620px; }
  #access .Inner dl dd { font-size: 14px; }
  #ticket .lead { padding: 0 60px 30px; }
  #ticket .reserve .figure li { margin-top: -20px; padding: 90px 35px 0 45px; }
  #ticket .reserve .figure li h4 { font-size: 16px; }
  #ticket .reserve .figure li:after { bottom: 0 !important; } }
/* SP */
@media screen and (max-width: 657px) { .pc { display: none; }
  .sp { display: block; }
  img { max-width: 100%; }
  #header { z-index: 1001; }
  .btn_pagetop { right: 20px; bottom: 90px; }
  .btn_pagetop img { width: 60px; }
  .mainVisual .mv h1 { width: calc(100% - 22px); top: 130px; right: 12px; margin-left: 0; }
  .mainVisual .mv h1 span { margin: -50px -3px 0 0; font-size: 15px; }
  .mainVisual .mv ul { height: 111vw; }
  .mainVisual .mv ul li { height: 111vw; margin-left: 0; left: 0; }
  .mainVisual #anker { width: calc(100% - 20px); margin-left: 10px; left: 0; }
  .mainVisual #anker ul li { height: 90px; }
  .mainVisual #anker ul li a { font-size: 11px; }
  .mainVisual #anker ul li a.small { font-size: 9px; }
  .mainLead p { background: url(../images/Introduction_frame_sp.png) no-repeat center center; background-size: cover; width: 355px; height: 230px; margin: 40px auto; padding: 0 10px; font-size: 15px; }
  #contents section h2.logona { display: block; margin-bottom: 10px; padding-left: 2em; text-indent: -2em; text-align: center; line-height: 1.2; font-size: 18px; }
  #contents section h2.logona img { width: 30px; display: inline-block; margin-bottom: -2px; }
  #knowledge .Cont { background-size: 95%; padding: 25px 0 210px; }
  #knowledge .Cont h2.logona { text-align: center; margin-bottom: 10px; }
  #knowledge .Cont p { width: calc(100% - 44px); font-size: 14px; line-height: 1.4; }
  #knowledge .period { padding-bottom: 110px; }
  #feature, #ticket, #tour { background-size: 170%; }
  #feature .Cont, #ticket .Cont, #tour .Cont { background-size: 17px; }
  #feature .pc, #ticket .pc, #tour .pc { display: none !important; }
  #feature h2.logona, #ticket h2.logona, #tour h2.logona { margin-bottom: 20px !important; padding: 40px 0 45px; }
  #feature h2:before, #feature h2:after, #ticket h2:before, #ticket h2:after, #tour h2:before, #tour h2:after { height: 45px; background-size: 168px; }
  #feature .Cont .Inner { background-color: #fff; background-image: url(../images/element_L.png), url(../images/element_R.png); background-repeat: no-repeat, no-repeat; background-position: 0 bottom, right 1px; background-size: 40px; width: 320px; margin: 0 auto 20px; overflow: hidden; padding-top: 25px; }
  #feature h2.logona img { width: 18px !important; margin-bottom: -6px !important; }
  #feature .Cont h3 { line-height: 1; text-align: center; font-size: 20px; }
  #feature .Cont h3 span { font-size: 14px; }
  #feature .Cont .detail { height: 250px; margin-top: 40px; }
  #feature .Cont .detail .subject { padding-bottom: 10px; line-height: 1.4; }
  #feature .Cont .detail .subject span { display: block; font-size: 12px; }
  #feature .Cont .detail .text, #feature .Cont .detail .note { padding: 0 10px; }
  #feature .Cont .detail .note { font-size: 12px; }
  #feature .Inner.sp { display: block; }
  #feature .Inner:nth-of-type(2) .detail { height: 200px; }
  #feature .bx-pager_2 { margin: -250px auto 250px; }
  #feature .lightup .detail { height: auto !important; margin-top: 5px; padding-bottom: 40px; }
  #feature .lightup .note { font-size: 10px; font-weight: bold; }
  #access { background: url(../images/access_bg_sp.png) repeat 0 0; }
  #access .Cont { background-image: url(../images/access_frame_top_sp.png), url(../images/access_frame_bottom_sp.png); background-repeat: no-repeat, no-repeat; background-position: center top, center bottom; background-size: 100%; padding: 140px 0 110px; }
  #access h2.logona { text-align: center; }
  #access h2.logona img { width: 18px !important; margin-bottom: -6px !important; }
  #access .Inner { width: 320px; margin: 0 auto; text-align: center; }
  #access .Inner dl { display: block; }
  #access .Inner dl dt, #access .Inner dl dd { width: auto !important; }
  #access .Inner dl dt { padding-bottom: 0; }
  #access .Inner dl dd { padding-bottom: 30px; padding-left: 0; }
  #access .Inner dl dd h3 { font-size: 18px; }
  #access .Inner dl dd p { text-align: left; }
  .bgImage .bgLine { background-size: 17px; }
  #tour { width: 100%; padding-bottom: 60px; }
  #tour h2.logona { margin-bottom: 20px !important; padding: 40px 0 48px; }
  #tour h2.logona img { margin-bottom: -7px !important; }
  #tour h2:before, #tour h2:after { height: 45px; background-size: 168px; }
  #tour .Inner { background-color: #fff; background-image: url(../images/element_L.png), url(../images/element_R.png); background-repeat: no-repeat, no-repeat; background-position: 0 bottom, right top; background-size: 40px; width: 320px; margin: 0 auto 20px; overflow: hidden; padding: 45px 10px; }
  #tour .tourColumn { display: block; }
  #tour .tourColumn__item { font-size: 14px; width: 100%; margin-bottom: 20px; }
  #tour .tourColumn .day, #tour .tourColumn .price { font-size: 18px; }
  #tour .otherTour { display: block; }
  #tour .otherTour .button { width: 80%; max-width: 320px; margin-bottom: 20px; font-size: 14px; }
  .otherBtn { margin-top: 20px; width: 90%; font-size: 15px; height: 45px; padding-bottom: 0; }
  .otherBtn .button { width: 100%; }
  /* bxSlider */
  .bx-wrapper, .lightup { position: relative; margin: 0 auto; }
  .bx-wrapper .subject, .lightup .subject { text-align: center; color: #2a505d; }
  .bx-wrapper .text, .lightup .text { font-size: 14px; }
  .bxSlider li { z-index: 2 !important; }
  .bx-prev, .bx-next { width: 12px; height: 20px; display: block; position: absolute; top: 31%; left: 10px; z-index: 5; overflow: hidden; text-indent: 1000px; margin-top: -10px; }
  .bx-prev { background: url(../images/icon_prev.png) no-repeat 0 0; background-size: 100%; }
  .bx-next { background: url(../images/icon_next.png) no-repeat 0 0; background-size: 100%; left: inherit; right: 10px; }
  .bx-pager, .bx-pager_2 { background: #000; width: 100%; margin: -300px auto 300px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; position: relative; line-height: 0; }
  .bx-pager a, .bx-pager_2 a { height: 40px; display: block; overflow: hidden; opacity: 0.5; }
  .bx-pager a.active, .bx-pager_2 a.active { opacity: 1; }
  .bx-pager .mt-1, .bx-pager_2 .mt-1 { margin-top: -10px; }
  .photo_forest { display: none; }
  #ticket .Cont { width: 100%; }
  #ticket .Cont .Inner { width: 320px; }
  #ticket h2 { margin-top: 15px !important; padding-bottom: 50px; }
  #ticket h2 span { font-size: 12px; }
  #ticket h3 { margin-bottom: 5px; font-size: 18px; }
  #ticket .lead { padding: 0 0 15px; font-size: 14px; }
  #ticket .reserve, #ticket .choice, #ticket .today { background-size: 40px; padding: 30px 0 50px; margin-bottom: 30px; }
  #ticket .reserve h3 { font-size: 18px; }
  #ticket .reserve .figure { padding: 0 10px; }
  #ticket .reserve .figure li { background-image: url(../images/bg_howto_base_top.png), url(../images/bg_howto_base_bottom.png); background-repeat: no-repeat, no-repeat; background-position: 0 0, 0 bottom; background-size: 100%, 100%; width: 310px; height: auto; margin: 0 auto 15px !important; padding: 15px 0 !important; }
  #ticket .reserve .figure li h4 { align-items: self-start; font-size: 16px; }
  #ticket .reserve .figure li h4 span { width: 20px; }
  #ticket .reserve .figure li:last-child:after { content: none !important; }
  #ticket .reserve .figure li:last-child h4 span { width: 30px; }
  #ticket .reserve .figure li .bg { background: url(../images/bg_howto_base_middle.png) repeat-y 0 0; background-size: 100%; width: 100%; padding: 30px 20px 0; }
  #ticket .reserve .figure li:after { content: url(../images/icon_arrow_R_sp.png) !important; bottom: -60px !important; transform: scale(0.6); right: 0 !important; left: inherit !important; }
  #ticket .choice { padding: 30px 10px 50px; }
  #ticket .choice h4 { height: 140px; padding: 0 0 10px; font-size: 12px; letter-spacing: -1px; box-sizing: border-box; }
  #ticket .choice h4 strong { font-size: 18px; }
  #ticket .choice h4:after { bottom: -42px; left: 50%; margin-left: -22px; border: 22px solid transparent; border-top: 22px solid #3b1918; }
  #ticket .choice .list { display: block; }
  #ticket .choice .list dt, #ticket .choice .list dd { width: auto; margin-bottom: 15px; }
  #ticket .choice .list dt img { width: 100%; }
  #ticket .choice .list dd { padding-left: 0; }
  #ticket .choice h5 { align-items: flex-start; margin-bottom: 10px; font-size: 16px; }
  #ticket .choice h5 img { width: 18px; margin: 2px 6px 0 0; }
  #ticket .choice .btn_site { float: none; display: block; text-align: center; }
  #ticket .choice .btn_site a { margin: 10px 0 20px; padding: 6px 12px; }
  #ticket .choice .notice { height: 200px; font-size: 14px; padding: 0 15px; text-align: left; }
  #ticket .choice .notice strong { display: block; margin-bottom: 5px; font-size: 18px; text-align: center; } }
@media screen and (max-width: 320px) { .se { display: block; }
  .mainVisual .mv h1 { top: 70px; }
  .mainLead p { width: 300px; height: 193px; font-size: 13px; }
  #knowledge .Cont { padding: 25px 0 170px; }
  #feature .Cont .detail { height: 300px; }
  #feature .Cont .Inner, #ticket .Cont .Inner, #tour .Cont .Inner { width: 280px; }
  #feature .Cont .Inner:nth-of-type(2) .detail { height: 230px; }
  #feature .bx-pager { margin: -350px auto 350px; }
  #feature .bx-pager_2 { margin: -280px auto 280px; } }
/*タブのスタイル*/
#tour .Inner { /*ラジオボタンを全て消す*/ /*タブ切り替えの中身のスタイル*/ /*選択されているタブのコンテンツのみを表示*/ /*選択されているタブのスタイルを変える*/ }
#tour .Inner .tab_item { width: 25%; float: left; text-align: center; border-right: #bcbcbc 1px solid; margin-bottom: 40px; box-sizing: border-box; color: #bcbcbc; display: block; position: relative; padding: 3px 0; transition: all .3s linear; height: 35px; font-size: 15px; font-weight: bold; }
#tour .Inner .tab_item:after { transition: all .3s linear; content: ""; display: block; position: absolute; bottom: -10px; right: 0; left: 0; width: 0%; height: 1px; background: #000; margin: auto; }
@media screen and (max-width: 736px) { #tour .Inner .tab_item:after { bottom: 0; } }
#tour .Inner .tab_item:nth-of-type(5n+1) { border-left: #bcbcbc 1px solid; }
#tour .Inner input[name="tab_item"] { display: none; }
#tour .Inner .tab_content { display: none; clear: both; overflow: hidden; }
#tour .Inner #tokyo:checked ~ #tokyo_content, #tour .Inner #osaka:checked ~ #osaka_content, #tour .Inner #nagoya:checked ~ #nagoya_content, #tour .Inner #fukuoka:checked ~ #fukuoka_content { display: block; }
#tour .Inner input:checked + .tab_item { color: #000; }
#tour .Inner input:checked + .tab_item:after { width: 70%; }
@media screen and (min-width: 737px) { #tour .Inner .tab_item:hover { color: #000; }
  #tour .Inner .tab_item:hover:after { width: 70%; } }

/*# sourceMappingURL=style.css.map */
