/* --------------------------
 * common
-------------------------- */
.section {display: block;}
.section .titleArea {position: relative;text-align: center;margin: 0px auto 25px;z-index: 99;}
.section .titleArea .title {color: #313131;font-family: 'Lato', sans-serif; font-weight: 700;line-height: 1em;display:block;position:relative;padding-bottom:17px;margin-bottom:17px;letter-spacing: 5px; font-size:36px;}
.section .titleArea .title:after {content:'';display:block;width:20px;height:2px;background:#4fa3ce;position:absolute;left:50%;margin-left:-10px;bottom:0;}
.section .titleArea .subtitle {letter-spacing: 1px;color: #313131;line-height: 1em;display:block;font-size:18px;text-align:center;}
.section .titleArea.white .title {color: #FFF;}
.section .titleArea.white .title:after {background:#4fa3ce;}
.section .titleArea.white .subtitle {color: #FFF;}
.section .titleArea.min {padding-bottom: 20px;}
.section .titleArea.min .title {padding-bottom:15px;margin-bottom:15px;letter-spacing: 2px; font-size:21px;}
.section .titleArea.min .title:after {width:14px;margin-left:-7px;}
.section .titleArea.min .subtitle {font-size:13px; letter-spacing: 0;}
@media screen and (max-width: 767px) {
     .section {padding-top: 50px;}
     .section .titleArea {text-align: center;margin: 0px auto 50px;}
     .section .titleArea .title { font-weight: bold;line-height: 1.6em;display:block;position:relative;padding-bottom:15px;margin-bottom:15px;letter-spacing: 3px; font-size:30px;font-family: 'Lato', sans-serif;font-weight: 700;}
     .section .titleArea .title:after {content:'';display:block;width:14px;height:2px;background:#4fa3ce;position:absolute;left:50%;margin-left:-7px;bottom:0;}
     .section .titleArea .subtitle {color:#313131;line-height: 1em;display:block;font-size:10px;text-align:center;letter-spacing:1px;}
     .section .titleArea.min {padding-bottom: 0px;}
     .section .titleArea.min .title {font-weight: 700;}
}

/* news */
#news {padding: 50px 0px 75px;background-color: #f5f5f5;}
.misc #news {padding: 25px 0;}
.misc #news .row {padding: 0px!important;background-color: #f5f5f5;margin: 0 -50px!important;}
#news .postList {margin: 25px 0px 37px;}
#news .postList ul {background-color: #fff;}
#news .postList ul li:first-child { border-top: 1px solid #eee;}
#news .postList ul li { border-bottom: 1px solid #eee;display: block;}
#news .postList ul li a {padding: 15px 20px;position: relative; color: #313131;display: block;-webkit-transition: all .3s ease;transition: all .3s ease; line-height: 20px;}
#news .postList ul li a .date {color: #4fa3ce;font-size: 12px;display:block;width: 80px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px;margin-bottom: 5px;}
#news .postList ul li a h2 {font-size: 14px;}
#news .postList ul li a h2 .new { font-size: 12px;margin-left: 15px; color: #BF0000;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 2px;}
#news .postList ul li a .fa {color: #4fa3ce;position: absolute; right: 20px; top: 50%;margin-top: -12px; font-size: 24px;-webkit-transition: all .3s ease;transition: all .3s ease;}
#news .postList ul li a:hover { background-color:rgba(79,163,206,0.1); text-decoration: none;}
#news .postList ul li a:hover .fa {right: 15px;}
#news .banner {}
#news .banner ul {}
#news .banner ul li {margin-top: 10px;}
#news .banner ul li:first-child {margin-top: 0px;}
#news .banner ul li a {height: 69px; display: block; position: relative; border: 2px solid #eee; background-color: #fff;}
#news .banner ul li a figure { width:65px;height: 65px; position: absolute;top:0; left: 0;}
#news .banner ul li a h2 {color: #313131;padding-left: 85px;display: block;font-size: 14px; font-weight: bold; line-height: 1em;padding-top: 14px;}
#news .banner ul li a h2 span {color:#4fa3ce; font-size:10px; font-weight: normal; display: block;margin-bottom:7px;}
#news .banner ul li a:hover { border: 2px solid #4fa3ce; -webkit-transition: all .3s ease;transition: all .3s ease;}
@media screen and (max-width: 767px) {
    #news {padding: 50px 0px 0px;;}
    #news .btn { width: auto; margin: 0px 0px 50px;}
    #news .postList {margin: 0px 0px 35px;}
    #news .postList ul li a {padding:15px 20px;}
    #news .postList ul li a .date {font-size: 12px;display:block; position: inherit; top: inherit; left: inherit;width:auto;margin-bottom: 5px;}
    #news .postList ul li a h2 { padding-left: 0px; font-size: 14px; line-height: 24px;}
    #news .banner {margin-bottom:50px;}
    .misc #news {padding: 25px 0px 15px;background-color: #f5f5f5;}
    .misc #news .row {padding: 0px!important;background-color: #f5f5f5;margin: 0px -25px!important;}
    .misc #news .banner {margin-bottom:10px;}
}

/* contact */
#contact {background-color: #4fa3ce;display: block;color:#fff;}
#contact .row { margin: 0 -50px;}
#contact .col-sm-4 { border-left: 1px solid rgba(255,255,255,0.25);padding: 85px 0px 25px;margin: 25px 0px;}
#contact .col-sm-4:first-child {border-left:none;}
#contact .col-sm-4 .inner { font-size: 12px; line-height: 1.8em;  text-align: center;}
#contact h2 {text-align: center;font-family: 'Lato', sans-serif;font-weight: 700; font-size: 30px;letter-spacing: 1px;margin-bottom: 15px;}
#contact h2 span {font-size: 14px;margin-right: 5px; color:#fff;}
#contact h2 a { color:#fff;}
#contact .inner h3 {display: block;font-family: 'Lato', sans-serif;font-weight: 400; font-size: 11px; text-align: center; position: absolute; top:45px; left: 0;width: 100%; letter-spacing: 1px; opacity: 0.5;}
#contact .inner .btn { margin: 0 60px; width:auto;}
#contact p {position: absolute; top:15px;left: 0;width: 100%;text-align: center;z-index: 99;}
#contact p span {line-height: 1em;padding: 0 10px;display:inline-block;font-size:21px; font-weight: bold;line-height: 1.6em;margin-bottom: 10px;}
@media screen and (max-width: 767px) {
    #contact {padding: 10px 25px 0px; text-align: center;background-color: #4fa3ce;}
    #contact h2 {margin: 25px 0px 15px;}
    #contact p {margin-bottom: 25px;}
    #contact h2.telLink a {color: #fff;}
    #contact .col-sm-4 {border-left: none;padding: 60px 0px 25px;margin: 0px; border-top: 1px solid #fff;}
    #contact .col-sm-4:first-child {border:none;}
    #contact .col-sm-4 .btn {margin-top: 20px;}
}

#map_canvas { height: 400px;}
@media screen and (max-width: 767px) {
    #map_canvas { height: 320px;}
}
/* footer */
#footer {background-color:#FFF;}
#footer .container {padding:50px 0px 25px; width: 1000px;}
#footer h1 {display: block;text-align: center; font-size: 12px;margin: 35px 0px;}
#footer h1 span {margin-right: 20px;}
#footer .logo {display: block; width: 200px;float: left;margin-right: 0px;margin-top: 0px;}
#footer .logo figure {margin-right: 50px;}
#footer .logo figure img {width: 100%;height: auto;}
#footer .footNav {display: block; width:800px; float: right;}
#footer .footNav ul {}
#footer .footNav ul li {line-height:2.4em;width: 160px;display:block;float: left;}
#footer .footNav ul li a { color: #313131; font-size: 11px;}
#footer .footNav ul li .fa { color: #4fa3ce;margin-right: 5px;}
#footer .footNav ul li .fa-angle-right {display: none;}
#footer .footNav ul li a:hover {}
#footer .copyright {text-align: left;font-size: 11px;color:#000;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 2px;margin-bottom: 15px;}
#footer .copyright .container { position: relative;display: block;height: 75px;}
#footer .copyright .container p { position: absolute; top: 0; left:0px;line-height: 75px;}
#footer .copyright .container ul { text-align: right; position: absolute; top: 0; right: 0px; font-size: 10px;line-height: 75px;}
#footer .copyright .container ul li {display: inline-block;}
#footer .copyright .container ul li a {color: #000;padding-left: 20px;}
#footer .copyright .container ul li a .fa {margin-right: 10px; color:#000; font-size: 12px;}
#footer .copyright .container ul li a:hover { text-decoration:underline;color: #000;}
#footer .footBtn {display: none;}
#scrlTop { opacity:0;text-align: center; line-height: 55px;z-index:10000;display:block;height: 50px; width: 50px; position: fixed; bottom: 50px; right: 50px; background-color: #1E3E4E; -webkit-transition: all .5s ease;transition: all .5s ease;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
#scrlTop .fa { color: #fff; font-size: 24px; cursor: pointer;}
#scrlTop.active {opacity: 1;-webkit-transition: all .5s ease;transition: all .5s ease;cursor: pointer;display:block;}
#scrlTop.active:hover { opacity: 0.5;}
@media screen and (max-width: 767px) {
    #scrlTop { opacity: 0;text-align: center; line-height:45px;display:block;height: 40px; width: 40px; position: fixed; bottom: 80px; right: 10px; cursor: pointer;-webkit-transition: all .5s ease;transition: all .5s ease;}
    #footer {padding-bottom: 70px;}
    #footer .container {padding:50px 0px 25px; width:auto;}
    #footer .footNav {display: none;}
    #footer .container {padding:0px;}
    #footer .logo {display: block; width: 150px;float: none;margin: 25px auto 0px;}
    #footer .logo figure {margin-right: 0px;}
    #footer .copyright { text-align: center; font-size: 10px;margin: 0;padding: 0;}
    #footer .copyright .container {height: auto;}
    #footer .copyright .container p { position: inherit; top: inherit; left:inherit;line-height: 75px;width: 100%;display: block; text-align: center;margin: 0;padding: 0;line-height: 50px;}
    #footer .copyright .container { position: relative;line-height: 70px;}
    #footer .copyright .container ul { display:none;}
    #footer .copyright span {display: none; }
    #footer .footBtn {display: block; background-color:#222;}
    #footer .footBtn ul {margin-left: -1px;}
    #footer .footBtn ul li { width: 20%;float: left; display: block;}
    #footer .footBtn ul li a {padding: 12px 0px 10px;text-align: center;font-size: 11px;font-weight: bold;display: block; color: #fff;border-left: 1px solid #111;transition: all .3s ease;-webkit-transition: all .3s ease;}
    #footer .footBtn ul li a img {width: 100%; height: auto;padding: 0 30px;padding-bottom: 5px;}
    #footer .footBtn ul li a:hover { background-color: #4fa3ce;}
}

/* --------------------------
 * home
-------------------------- */
/* mainVisual */
.home #mainVisual {display: block;position: relative; width: 100%; height: auto;z-index: 0;margin-top: 130px;}
.home #mainVisual .swiper-container .contact { width: 350px; height: auto;display: block; position: absolute;z-index: 9999;bottom:25px;left:25px;}
.home #mainVisual .swiper-container .contact figure { width: 350px;height: auto;  text-align: center;display: block;margin: 0 auto;background-color: rgba(79,163,206,0.9);overflow: hidden;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.home #mainVisual .swiper-container .contact figure img {width: 350px; height: auto; margin: 0 auto;}
.home #mainVisual .swiper-container {position: relative;z-index: 0;display: block;}
.home #mainVisual .swiper-container .swiper-pagination {z-index: 99;width: 100%;position: absolute; top:25px; right: 40px; text-align: right; display: none;}
.home #mainVisual .swiper-container .swiper-button-prev {left: 30px;display: block;}
.home #mainVisual .swiper-container .swiper-button-next {right: 30px;display: block;}
.home #mainVisual .swiper-container .tanuki { width: 150px;; height: auto;display: block; position: absolute;z-index: 9999;bottom:25px;right:75px;}
@media screen and (max-width: 767px) {
    .home #mainVisual .swiper-container .swiper-pagination {padding-right: 12px; display: none;}
    .home #mainVisual {margin-top: 70px;}
    .home #mainVisual .contact {display: none;}
    .home #mainVisual .swiper-container .tanuki { width: 150px; height: auto;display: block; position: absolute;z-index: 9999;bottom:25px;right:75px;}
}

.home #about { background-color: #FFF;background-image: url(images/index/about3.jpg);background-size: cover; background-position:bottom center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover;}
.home #about .col-sm-6 {position: relative;}
.home #about .lead {text-align: center;width: 100%;font-size:16px;display: block; height: 250px;line-height: 2.2em;color: #FFF;position: absolute; top: 0; left: 0; right: 0; bottom:0; margin: auto;}
.home #about .lead span  {font-family: 'Lato', sans-serif; font-weight: 700;line-height: 1em;display:block;position:relative;padding-bottom:25px;margin-bottom:35px;letter-spacing: 3px; font-size:21px;}
.home #about .lead span:after {content:'';display:block;width:400px;height:1px;background:#FFF;position:absolute;left:50%;margin-left:-200px;bottom:0;}
@media screen and (max-width:1200px) {
    .home #about .lead {font-size:14px; height: 220px;}
    .home #about .lead span  {letter-spacing: 2px; font-size:21px; margin-bottom: 25px;}
}
@media screen and (max-width: 767px) {
    .home #about {height: auto;background-position:-80px center;}
    .home #about figure {display: none;}
    .home #about .row { background-color:rgba(0,0,0,0.7);height: auto;}
    .home #about .col-sm-6 {position:inherit;display: block;}
    .home #about .lead {text-align: left;height: auto;padding: 100px 50px;position: inherit; top: inherit; left: inherit; right: inherit; bottom:inherit; margin:inherit;}
    .home #about .lead br {display: none;}
    .home #about .lead span  { text-align: center;letter-spacing: 2px; font-size:16px;}
    .home #about .lead span:after {width:100%;margin-left:-50%;}
}

.home #service {padding:0px; margin: 0 auto;padding:100px 0px 50px;position: relative;}
.home #service:before {z-index: 0;content:" ";position: absolute;top:0; left: 0; width: 100%; height: 450px; background-color: rgba(79,163,206,0.1); display: block;background-image: url(images/index/service_bg_img.jpg);background-size: cover; background-position:bottom center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover; }
.home #service .row {padding: 0px 50px;margin:50px auto 0px;max-width: 1440px; }
.home #service .desc { text-align: center; color: #fff;margin-top: 40px; font-size: 16px;line-height: 2em;}
.home #service .descl { text-align: center; color: #fff;margin-top: 40px; font-size: 16px;line-height: 2em;}
.home #service .inner {}
.home #service .inner a {position: relative;height: 100%;}
.home #service .inner a p { width: 150px;color:#4fa3ce; background-color: #fff;display: none;position: absolute; top: -18px; left: 50%;margin-left: -75px;text-align: center;z-index: 99;font-family: 'Philosopher', sans-serif;font-weight: 400; letter-spacing: 2px; font-size: 13px;}
.home #service .inner a p span { margin-left: 5px;}
.home #service .inner a { display: block;}
.home #service .inner a:hover { background-color: #f5f5f5}
.home #service .inner a figure { display: block; overflow: hidden;z-index: 0;background-color: #4fa3ce;}
.home #service .inner a figure img {-webkit-transition: all .3s ease;transition: all .3s ease;-webkit-transform:scale(1);transform:scale(1);}
.home #service .inner a:hover figure img {-webkit-transform:scale(1.05);transform:scale(1.05);opacity: 0.5;}
.home #service .inner a h1 {margin-top: 25px; position: relative; z-index: 1;color: #313131;width: 100%;text-align: center; font-size:21px;font-weight: bold;}
.home #service .inner a h1 span {margin-left: 2px;margin-bottom: 15px;color:#4fa3ce;display: block;font-size:24px;font-family: 'Lato', sans-serif; font-weight: 700; letter-spacing: 3px;}
.home #service .inner a .text {color: #313131;padding: 25px 50px 50px; font-size: 14px; line-height: 1.8em;}
.home #service .inner a .fa {background-color: #fff;opacity : 0;transform : translate(0px, 25px);transition : all 500ms;text-align: center; position:absolute; bottom:-24px; left:50%; width: 48px; height: 48px; margin-left: -24px; font-size: 32px;color:#4fa3ce; line-height: 45px;padding-left: 2px;border-radius: 24px;-moz-border-radius: 24px;-webkit-border-radius: 24px;-o-border-radius: 24px;-ms-border-radius: 24px;}
.home #service .inner a:hover .fa { opacity : 1; transform : translate(0, 0);}
@media screen and (max-width:1200px) {
    .home #service .inner a .text {color: #313131;padding: 25px 25px 35px; font-size: 14px; line-height: 1.8em;}
}
@media screen and (max-width: 767px) {
    .home #service {padding:0px; margin: 0 auto;padding:40px 0px 25px;position: relative;}
    .home #service .desc { text-align: left;margin: 40px; font-size: 14px;line-height: 2em;}
    .home #service .desc br {display: none;}
    .home #service .descl { text-align: left;margin: 40px; font-size: 14px;line-height: 2em;}
    .home #service .descl br {display: none;}
    .home #service .row {padding: 0px;margin:50px auto 0px;max-width: 1430px; }
    .home #service .inner a .fa {display: none;}
    .home #service .inner a .text {color: #313131;padding: 15px 25px 35px; font-size: 13px; line-height: 1.8em;}
    .home #service .inner a h1 {margin-top: 15px;font-size:18px;}
    .home #service .inner a h1 span {margin-left: 2px;margin-bottom: 10px;font-size:21px;letter-spacing: 2px;}
}

.home #souvenir {position: relative;padding: 100px 0px 50px; margin: 0 auto; min-width: 1000px;}
.home #souvenir .miniSlider{position: absolute;top:0; left: 0; width: 100%; height: 450px;background-color: #000}
.home #souvenir h2 { font-size: 14px; text-align: center;margin-top: 7px; color: #313131;}
.home #souvenir .desc { text-align: center; color: #fff;margin-top: 40px; font-size: 16px;line-height: 2em;}
.home #souvenir .descl { text-align: center; color: #fff;margin-top: 40px; font-size: 16px;line-height: 2em;}
.home #souvenir .btn { width: 400px; margin: 0 auto;}
.home #souvenir .ranking {padding: 50px 50px 0px;max-width: 1440px;margin: 0 auto;}
.home #souvenir .ranking .block { position: relative;display: block;background-color: #fff;}
.home #souvenir .ranking .block.gold { border-top: 5px solid #e7d02a;}
.home #souvenir .ranking .block.silver { border-top: 5px solid #b0a995;}
.home #souvenir .ranking .block.bronze { border-top: 5px solid #b78c3d;}
.home #souvenir .ranking .block .rank { position: absolute; top: -30px; left:15px;; width: 60px; height: auto;z-index: 9;}
.home #souvenir .ranking figure { position: relative;}
.home #souvenir .ranking h2 {color: #313131;font-weight: bold; font-size: 21px; border-bottom: 1px solid #eee;padding-bottom:20px;margin: 25px 50px;}
.home #souvenir .ranking .text { margin: 15px 50px 50px;color: #313131; line-height: 1.8em; font-size: 15px;}
@media screen and (max-width:1200px) {
    .home #souvenir .ranking h2 {font-size: 18px;padding-bottom:20px;margin: 25px 35px;}
    .home #souvenir .ranking .text { margin: 15px 35px 50px;}
}
@media screen and (max-width: 767px) {
    .home #souvenir {margin: 0;padding:40px 0px 0px;position: relative;min-width:auto;}
    .home #souvenir .desc { text-align: left;margin: 40px; font-size: 14px;line-height: 2em;}
    .home #souvenir .desc br {display: none;}
    .home #souvenir .descl { text-align: left;margin: 40px; font-size: 14px;line-height: 2em;}
    .home #souvenir .descl br {display: none;}
    .home #souvenir .row {padding: 0px;margin:50px auto 0px;max-width: 1430px; }
    .home #souvenir .ranking {margin: 0;}
    .home #souvenir .ranking h2 {padding-bottom:20px;margin: 25px 40px 0px;}
    .home #souvenir .ranking a {margin-top: -5px;}
    .home #souvenir .ranking a .fa {display: none;}
    .home #souvenir .ranking .text {color: #313131;margin: 20px 40px 35px; font-size: 14px; line-height: 1.8em;}
    .home #souvenir .btn { width: auto; margin: -10px 25px 25px;}
}

.home #miniSlider {position: relative;padding:0px 0px 50px;min-width: 1000px!important;}
.home #miniSlider .souvenirSlider {margin: 0 75px;overflow: hidden;}
.home #miniSlider h3 {color:#30637D;text-align: center; width: 100%;font-size: 14px;margin-top: 10px;}
.home #miniSlider .swiper-button-prev {left: 15px;right: auto;}
.home #miniSlider .swiper-button-next {right:15px;left: auto;}
.home #miniSlider .swiper-button-prev,
.home #miniSlider .swiper-button-next {color: #4fa3ce;font-size: 48px;top: 50%;width: 50px;height: 50px;display: block; position: absolute;margin-top: -60px;z-index: 99;cursor: pointer;background-position: center; background-repeat: no-repeat; background-color:transparent; text-align: center; line-height: 45px;}
.home #miniSlider .btn { max-width: 350px; margin: -25px auto 0px;}

/* climbing */
.home #climbing {margin: 0px 0px 0px;}
.home #climbing .imgBox { background-image: url(images/index/climbing_bg_img.jpg); padding: 100px 0px;background-attachment: fixed;}
.home #climbing .inner {padding: 0px 75px 0px 75px;}
.home #climbing h1 { text-align: center;color: #92BFD6; margin-bottom: 30px;display: block;font-family: 'Lato', sans-serif; font-weight: 700;letter-spacing: 1px;font-size:42px;}
.home #climbing h2 { text-align: center;color: #FFF; font-size: 30px; font-weight: bold;line-height: 1.7em;margin-bottom: 25px;}
.home #climbing h3 {color: #FFF; font-size: 14px; line-height: 1.8em;margin-bottom: 25px;}
.home #climbing p {color: #4fa3ce; font-size: 14px; font-family: 'Lato', sans-serif; font-weight: 400;letter-spacing: 1px;margin-bottom: 5px;}
.home #climbing .inner ul { width: 100%; margin: 0 -5px;}
.home #climbing .inner ul li { width: 50%; float: left;}
.home #climbing .inner ul li a { border: 1px solid #FFF;padding-left: 20px;font-size: 14px;position: relative;color:#FFF;text-align: left;display: block;line-height: 40px;margin:5px;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.home #climbing .inner ul li a .fa { position: absolute; top: 8px; right: 10px; font-size: 21px; color: #4fa3ce;}
.home #climbing .inner ul li a:hover {border: 1px solid #4fa3ce;background-color:#4fa3ce; color: #FFF;}
.home #climbing .inner ul li a:hover .fa {color: #fff;}
@media screen and (max-width:1200px) {
    .home #climbing h1 {font-size:36px; text-align: center;margin-bottom: 20px;}
    .home #climbing h2 {font-size: 30px;margin-bottom: 20px;}
    .home #climbing .imgBox {padding: 75px 0;background-attachment:inherit;background-size: cover; background-position: 20% center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover;}
    .home #climbing .inner {padding: 0px 50px;}
    .home #climbing .inner ul li a {padding-left: 20px;font-size: 14px;line-height: 40px; margin: 3px;}
    .home #climbing .inner ul li a .fa {top: 8px; right: 10px;}
}
@media screen and (max-width: 767px) {
    .home #climbing h1 {font-size:26px; text-align: center;margin-bottom: 15px;}
    .home #climbing h2 {font-size: 24px;margin-bottom: 20px;}
    .home #climbing .imgBox {padding: 50px 0;background-attachment:inherit;background-size: cover; background-position: 20% center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover;}
    .home #climbing .inner {padding: 0px 50px;}
    .home #climbing .inner ul { width: 100%; margin: 0 -3px;}
    .home #climbing .inner ul li { width: 100%; float: left;}
    .home #climbing .inner ul li a {padding-left: 20px;font-size: 14px;line-height: 40px; margin: 3px;}
    .home #climbing .inner ul li a .fa {top: 8px; right: 10px;}
}

/* etegami */
.home #etegami {margin: 0px 0px 0px;}
.home #etegami .imgBox { background-image: url(images/index/etegami_bg_img.jpg); background-position: center right;padding: 100px 0px;background-attachment: fixed;}
.home #etegami .inner {padding: 0px 0px 0px 75px;}
.home #etegami h1 { text-align: center;color: #4fa3ce; margin-bottom: 30px;display: block;font-family: 'Lato', sans-serif; font-weight: 700;letter-spacing: 1px;font-size:42px;}
.home #etegami h2 { text-align: center;color: #FFF; font-size: 30px; font-weight: bold;line-height: 1.7em;margin-bottom: 25px;}
.home #etegami h3 {color: #FFF; font-size: 14px; line-height: 1.8em;margin-bottom: 25px;}
.home #etegami p {color: #4fa3ce; font-size: 14px; font-family: 'Lato', sans-serif; font-weight: 400;letter-spacing: 1px;margin-bottom: 5px;}
.home #etegami .inner ul { width: 100%; margin: 0 -5px;}
.home #etegami .inner ul li { width: 50%; float: left;}
.home #etegami .inner ul li a { border: 1px solid #FFF;padding-left: 20px;font-size: 14px;position: relative;color:#FFF;text-align: left;display: block;line-height: 40px;margin:5px;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.home #etegami .inner ul li a .fa { position: absolute; top: 8px; right: 10px; font-size: 21px; color: #4fa3ce;}
.home #etegami .inner ul li a:hover {border: 1px solid #4fa3ce;background-color:#4fa3ce; color: #FFF;}
.home #etegami .inner ul li a:hover .fa {color: #fff;}
@media screen and (max-width:1200px) {
    .home #etegami h1 {font-size:28px;margin-bottom: 20px;}
    .home #etegami h2 {font-size: 24px;margin-bottom: 20px;}
    .home #etegami h3 {margin-right: 0px;}
    .home #etegami .imgBox {padding: 50px 0;background-attachment:inherit;background-size: cover; background-position: 20% center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover;}
    .home #etegami .inner {padding: 0px 50px;}
    .home #etegami .inner ul { width: 100%; margin: 0 -3px;}
    .home #etegami .inner ul li { width: 100%; float: left;}
    .home #etegami .inner ul li a {padding-left: 20px;font-size: 14px;line-height: 40px; margin: 3px;}
    .home #etegami .inner ul li a .fa {top: 8px; right: 10px;}
}

/* --------------------------
 * misc
-------------------------- */
.misc #mainVisual { height: 400px; width: 100%; background-color: #000; position: absolute; top: 0px; left: 0;z-index: -1;background-size: cover; background-position: center; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-ms-background-size: cover;}
.misc #mainVisual.about {background-image: url(images/about/main.jpg);}
.misc #mainVisual.lodge {background-image: url(images/lodge/main.jpg);}
.misc #mainVisual.restaurant {background-image: url(images/restaurant/main.jpg);}
.misc #mainVisual.shop {background-image: url(images/shop/main.jpg);}
.misc #mainVisual.souvenir {background-image: url(images/souvenir/main.jpg);}
.misc #mainVisual.climbing {background-image: url(images/climbing/main.jpg);}
.misc #mainVisual.etegami {background-image: url(images/etegami/main.jpg);}
.misc #mainVisual.access {background-image: url(images/access/main.jpg);}
.misc #mainVisual.news {background-image: url(images/news/main.jpg);}
.misc #mainVisual h1 { position: absolute; left: 0px; top:200px; font-size: 18px; color: #fff; width: 100%; text-align: center;}
.misc #mainVisual h1:after {content:'';display:block;width:20px;height:2px;background:rgba(255,255,255,1);position:absolute;left:50%;margin-left:-10px;top:45px;}
.misc #mainVisual h1 span {margin-bottom: 40px;display: block;color:#4fa3ce;font-size: 36px;font-family: 'Lato', sans-serif; font-weight: 700; letter-spacing: 4px; }
.misc #mainVisual .crumbs {font-size: 12px; line-height: 35px; position: absolute; right:0px; bottom:25px; text-align: center; z-index: 1; width: 100%;}
.misc #mainVisual .crumbs ul {text-align: center;margin-left: 3px;}
.misc #mainVisual .crumbs ul li {color: #000;display: inline;margin-right: 7px;}
.misc #mainVisual .crumbs ul li .fa {color: #4fa3ce;}
.misc #mainVisual .crumbs ul li a { color: #FFF;}
.misc #mainVisual .crumbs ul li a:hover {color: #FFF; text-decoration: underline;}
@media screen and (max-width: 767px) {
    .misc #mainVisual { height: 280px; width: 100%; background-color: #000;}
    .misc #mainVisual h1 {top:120px; font-size: 14px;}
    .misc #mainVisual h1:after {display: none;}
    .misc #mainVisual h1 span {font-size: 24px;margin-bottom: 15px;letter-spacing: 2px;}
}

/* contents */
.misc #contents {margin: 400px auto 0px;padding: 75px 0px 25px;background-color: #FFF;}
.misc #contents .crumbs {font-size: 12px; line-height: 35px;text-align: center; z-index: 1; width: 100%;margin-top: 25px;}
.misc #contents .crumbs ul {text-align: center;margin-left: 3px;}
.misc #contents .crumbs ul li {color: #000;display: inline;margin-right: 7px;}
.misc #contents .crumbs ul li .fa {color: #4fa3ce;}
.misc #contents .crumbs ul li a { color: #313131;}
.misc #contents .crumbs ul li a:hover {color: #313131; text-decoration: underline;}
.misc #contents .subNav {display: block;font-size: 16px;position: relative;z-index: 9;margin-top: 50px;}
.misc #contents .subNav.top {margin-bottom: 50px;margin-top: 0;}
.misc #contents .subNav ul { text-align: center;}
.misc #contents .subNav ul li {display: inline-block;line-height: 60px;}
.misc #contents .subNav ul li a { border-top: 2px solid #eee; display:block;color: #313131;padding: 0px 30px;}
.misc #contents .subNav ul li.active a {border-top: 2px solid #8bb254;background-color: transparent;text-decoration: none; color: #000; font-weight: bold;}
.misc #contents .subNav ul li a:hover {text-decoration: none;border-top: 2px solid #4fa3ce;}
.misc #contents .subNav.top ul li a { border-top: none;border-bottom: 2px solid #eee;display:block;color: #313131;padding: 0px 30px;}
.misc #contents .subNav.top ul li.active a {position: relative;border-bottom: 2px solid #8bb254;text-decoration: none; color: #1E3044; font-weight: bold;}
.misc #contents .subNav.top ul li.active a::after {position: absolute; top: -35px; left: 50%;font-family: FontAwesome;content : "\f0dd"; color: #8bb254; font-size: 18px; text-align: center; width: 50px; margin-left: -25px;}
.misc #contents .subNav.top ul li a:hover {text-decoration: none;border-bottom: 2px solid #4fa3ce;}
.misc #contents .subNav ul li a .fa {display: none;}
@media screen and (max-width: 767px) {
    .misc #contents { width: auto; margin: 280px auto 0px;padding: 0px 0px 25px;background-color: #FFF;}
    .misc #contents .subNav {display: block;font-size: 13px;padding: 0px;margin: 30px 19px 10px; background-color: transparent;}
    .misc #contents .subNav ul li {display:block;line-height: 40px;margin-right: 0px; width: 50%; float: left;}
    .misc #contents .subNav ul li a {border:1px solid #ccc;text-align: left;position: relative;background-color:#fff ;font-weight: bold;display:block;color: #1E3044;padding: 0px;padding-left: 20px;margin: 2px;border-radius: 0px;-moz-border-radius: 0px;-webkit-border-radius: 0px;-o-border-radius: 0px;-ms-border-radius: 0px;}
    .misc #contents .subNav ul li.active a {color:#FFF;border:1px solid #4fa3ce; background-color: #4fa3ce;}
    .misc #contents .subNav ul li a:hover {background-color: #4fa3ce;text-decoration: none; color: #FFF;border:1px solid #4fa3ce;}
    .misc #contents .subNav ul li a .fa {display: block; position: absolute; top: 50%; right: 12px; font-size: 18px;margin-top: -9px;}
    .misc #contents .subNav.top ul li.active a::after {display: none;}
    .misc #contents .subNav.top ul li.active a {color:#FFF;border:1px solid #4fa3ce; background-color: #4fa3ce;}
    .misc #contents .subNav.top ul li a {border:1px solid #ccc;text-align: left;position: relative;background-color:#fff ;font-weight: bold;display:block;color: #1E3044;padding: 0px;padding-left: 20px;margin: 2px;border-radius: 0px;-moz-border-radius: 0px;-webkit-border-radius: 0px;-o-border-radius: 0px;-ms-border-radius: 0px;}
}

.misc #contents h2.title {padding-top: 15px;font-size: 18px; border-top: 1px solid #ddd;padding-left: 10px; font-weight: bold;}
.misc #contents h2.title span {margin-top: 5px;display: block;color:#4fa3ce;font-size: 12px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px; }
.misc #contents h3.subTitle {color:#4fa3ce; font-size: 14px; font-weight: bold; font-size: 16px;margin-bottom: 25px; background-color: #f5f5f5;padding: 10px 20px;}
.misc #contents h3.caution { text-align: center;color:#4fa3ce; font-size: 14px; font-weight: bold; font-size: 16px;margin: 25px 0px; background-color: #f5f5f5;padding: 10px 20px;}
.misc #contents h4.miniTitle {border-left: 5px solid #4fa3ce; padding: 2px 15px;font-size: 16px; font-weight: bold;margin-bottom: 10px;margin-top: 25px;}
.misc #contents ul.list {}
.misc #contents ul.list li {list-style-type: disc;padding-left: 0px;margin-left: 15px;margin-bottom: 5px;}
.misc #contents .text { font-size: 14px; line-height: 2em;}
.misc #contents .text.text-center {margin-top: 25px;margin-bottom: -50px;}
.misc #contents .text.lg { font-size: 18px; line-height: 2em;margin: 25px 0px 50px;}
.misc #contents .text figure { float: right; width:300px; height: auto;margin-left: 25px;}
.misc #contents .note { font-size: 12px;}
@media screen and (max-width: 767px) {
    .misc #contents h2.title {margin:0px -25px 25px;padding-left: 0px; text-align: center;padding-top: 25px;}
    .misc #contents .text.lg { font-size: 16px; line-height: 2em;margin: 50px 25px 0px;}
    .misc #contents .text.text-center {margin-top: 25px;margin-bottom: -50px; text-align: left;}
    .misc #contents .text.text-center br {display: none;}
    .misc #contents .note {margin-top: 10px;}
    .misc #contents .text figure { float: none; width:100%; height: auto;margin-left: 0px;margin-bottom: 25px;}
}

/* menu */
.misc #contents .menu {margin-top: 50px;padding: 0 25px;display: block;}
.misc #contents .menu h3 { font-size:21px;margin-bottom: 25px; font-weight: bold;border-left: 5px solid #4fa3ce;padding: 5px 25px;}
.misc #contents .menu h3 span {font-family: 'Lato', sans-serif;font-weight: 400;margin-left: 15px; letter-spacing: 2px; font-size: 11px;color:#4fa3ce;}
.misc #contents .menu > ul {margin-bottom: 50px;}
.misc #contents .menu > ul > li {margin-top: 10px; display: block; position: relative; font-size: 16px; height: 40px;}
.misc #contents .menu > ul > li:after {content:'';display:block; height: 1px; background-color: #eee;position: absolute; top: 12px; left: 0; width: 100%;}
.misc #contents .menu > ul > li:first-child {margin-top: 0px;}
.misc #contents .menu > ul > li > span {z-index: 99;display: block; background-color: #fff;height: 25px;position: absolute;letter-spacing: 1px;}
.misc #contents .menu > ul > li > span.price {padding-left: 20px;right: 0; top: 0;}
.misc #contents .menu > ul > li > span.name{padding-right: 20px;left: 0; top: 0;}
.misc #contents .menu > ul > li > span.names{padding-right: 20px;left: 0; top: 0; font-size: 14px;}
@media screen and (max-width: 767px) {
    .misc #contents .menu {padding: 0 10px;}
    .misc #contents .menu h3 { font-size:18px;padding: 2px 0px 2px 15px;}
    .misc #contents .menu h3 span {font-size: 8px;}
    .misc #contents .menu > ul > li {font-size: 14px; height: 30px;}
    .misc #contents .menu > ul > li > span.names{font-size: 11px; height: 30px;}
}

.misc #contents.about { min-width: 1000px;padding-top: 0;}
.misc #contents.about .row.desc {z-index: 1;position: relative;padding: 0px; margin: 75px auto 0px;max-width: 1440px;}
.misc #contents.about .row.descl {z-index: 1;position: relative;padding: 0px; margin: 75px auto 0px;max-width: 1440px;}
.misc #contents.about .row figure { position: relative;}
.misc #contents.about .row .inner {padding: 60px 75px;display: block; position: relative; width: 100%;height: 100%;-webkit-transition: all .3s ease;transition: all .3s ease;}
.misc #contents.about .row .inner h1 {font-size: 28px;text-align: center;margin-bottom: 30px;font-weight: bold;}
.misc #contents.about .row .inner h2 {color: #4fa3ce; font-weight: bold; font-size: 18px;margin-bottom: 15px; line-height: 1.6em;}
.misc #contents.about .row .inner .text { font-size: 14px;line-height: 2em;}
.misc #contents.about .bg_color {margin: -50px 0px 75px 75px;background-color: rgba(79,163,206,0.3);display: block; position: relative;z-index: 0;}
.misc #contents.about .bg_color .row.gallery {padding:80px 50px 50px;max-width: 1440px;margin: 0 auto;}
.misc #contents.about .bg_color .row.gallery .block {margin-top: 25px;}
.misc #contents.about .bg_color .row.gallery h3 { text-align: center; font-size: 14px;margin-top: 10px;}
@media screen and (max-width:1200px) {
    .misc #contents.about .row.desc {margin: 50px auto 0px;}
    .misc #contents.about .row.descl {margin: 50px auto 0px;}
    .misc #contents.about .row .inner h1 {font-size: 21px;margin-bottom: 20px;}
    .misc #contents.about .row .inner h2 {font-size: 16px;margin-bottom: 10px;}
    .misc #contents.about .row .inner .text { font-size: 13px;line-height: 1.8em;}
    .misc #contents.about .row .inner {padding: 50px 50px;}
    .misc #contents.about .bg_color {margin: -25px 0px 50px 75px;}
    .misc #contents.about .bg_color .row.gallery {padding:50px 50px 50px;}
}
@media screen and (max-width: 767px) {
    .misc #contents.about { min-width: auto;padding-top: 0;}
    .misc #contents.about .row.desc {margin: 0px auto}
    .misc #contents.about .row.descl {margin: 0px auto}
    .misc #contents.about .row .inner {padding: 50px;}
    .misc #contents.about .bg_color {margin:0px;}
    .misc #contents.about .bg_color .row.gallery {padding:25px 15px;}
    .misc #contents.about .bg_color .row.gallery .block {margin: 0;padding: 0 10px;}
}

.misc #contents.facility {}
.misc #contents.facility #lead {display: block;position: relative;max-width: 1440px;margin: 0px auto 0px;}
.misc #contents.facility #lead .mainImg {position: relative;height: 500px;display: block;margin-right: 100px; background-color: #000;z-index: 1;}
.misc #contents.facility #lead .mainImg.lodge {background-image: url(images/lodge/lead.jpg);}
.misc #contents.facility #lead .mainImg.restaurant {background-image: url(images/restaurant/lead.jpg);}
.misc #contents.facility #lead .mainImg.shop {background-image: url(images/shop/lead.jpg);}

.misc #contents.facility #lead .deco {position: absolute; top: 300px; height: 300px; background-color: rgba(79,163,206,0.25);display: block; width: 100%;z-index: 0;right: -100px;}
.misc #contents.facility #lead .desc {width: 360px;background-color: rgba(255,255,255,1);padding: 50px;font-size:14px; letter-spacing: 1px;line-height: 2em; text-align:left; position: absolute; top: 90px; right: 50px;z-index: 9;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.misc #contents.facility #lead .descl {width: 460px;background-color: rgba(255,255,255,1);padding: 50px;font-size:14px; letter-spacing: 1px;line-height: 2em; text-align:left; position: absolute; top: 90px; right: 50px;z-index: 9;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.misc #contents.facility #lead .desc h1 {font-weight: bold;text-align: center; font-size: 28px; line-height: 1em;margin-bottom: 30px;}
.misc #contents.facility #lead .desc h1 span {margin-top: 7px; text-align: center; font-size: 21px;color:#4fa3ce;font-size: 14px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px; display: block;}

.misc #contents.facility #lead .descl {width: 360px;background-color: rgba(255,255,255,1);padding: 50px;font-size:14px; letter-spacing: 1px;line-height: 2em; text-align:left; position: absolute; top: 90px; right: 50px;z-index: 9;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.misc #contents.facility #lead .descl {width: 360px;background-color: rgba(255,255,255,1);padding: 50px;font-size:14px; letter-spacing: 1px;line-height: 2em; text-align:left; position: absolute; top: 90px; right: 50px;z-index: 9;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.misc #contents.facility #lead .descl h1 {font-weight: bold;text-align: center; font-size: 28px; line-height: 1em;margin-bottom: 30px;}
.misc #contents.facility #lead .descl h1 span {margin-top: 7px; text-align: center; font-size: 21px;color:#4fa3ce;font-size: 14px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px; display: block;}
.misc #contents.facility #lead .tel {width: 400px;font-size:16px; letter-spacing: 2px;line-height: 2em; text-align: center; position: absolute; top: 60px; right: 60px;z-index: 9;background-color:#4fa3ce;padding: 20px 50px;}
.misc #contents.facility #lead > figure {padding-right: 350px;}
.misc #contents.facility #lead .row { margin: 20px auto 20px; width: 1000px; z-index: 9; position: relative;}
.misc #contents.facility #lead .row figure {overflow: hidden;margin: 15px 15px 7px; background-color: #fff;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.misc #contents.facility #lead .row figure a { position: relative;display: block;}
.misc #contents.facility #lead .row figure a .fa { position: absolute; bottom: 10px; right: 10px; color: #fff; font-size: 18px;}
.misc #contents.facility #lead .row h3 { text-align: center; font-size: 14px;margin-bottom: 10px;}
.misc #contents.facility >.container > .row {margin-top: 50px;}
@media screen and (max-width: 767px) {
    .misc #contents.facility .row.section {margin-top: 0px;}
    .misc #contents.facility #lead .mainImg {height: 250px;margin-right: 0px;}
    .misc #contents.facility #lead .desc {width: 100%; position:relative; top: inherit; right: inherit;background-color:transparent;padding: 50px 50px 50px;}
    .misc #contents.facility #lead .desc h1 {text-align: center; font-size: 28px; line-height: 1em;margin-bottom: 25px;}
    .misc #contents.facility #lead .descl {width: 100%; position:relative; top: inherit; right: inherit;background-color:transparent;padding: 50px 50px 50px;}
    .misc #contents.facility #lead .descl h1 {text-align: center; font-size: 28px; line-height: 1em;margin-bottom: 25px;}
    .misc #contents.facility #lead .deco {display: none;}
    .misc #contents.facility #lead .row { margin: 25px 15px 0px; width: auto;}
    .misc #contents.facility #lead .row figure {margin: 10px; }
    .misc #contents h2.title {margin:0px -25px 25px;padding-left: 0px; text-align: center;padding-top: 25px;}
}

.misc #contents .ranking {padding: 0px 0px 0px; margin: 0 -25px;}
.misc #contents .ranking a { position: relative;display: block;background-color: #fff;}
.misc #contents .ranking a:hover{background-color: #f5f5f5;}
.misc #contents .ranking a.gold { border-top: 5px solid #e7d02a;}
.misc #contents .ranking a.silver { border-top: 5px solid #b0a995;}
.misc #contents .ranking a.bronze { border-top: 5px solid #b78c3d;}
.misc #contents .ranking a .rank { position: absolute; top: -40px; left:20px;; width: 70px; height: auto;z-index: 9;}
.misc #contents .ranking figure { position: relative;}
.misc #contents .ranking a .limit {z-index: 9;font-size: 12px; text-align: center; color: #FFF;width: 150px; height: 25px; display: block; position: absolute;top: -15px; right:15px; background-color:#F36;}
.misc #contents .ranking .text .soldout {font-weight: bold;margin-left: 10px;}
.misc #contents .ranking h2 {text-align: center;color: #313131;font-weight: bold; font-size: 21px; border-bottom: 1px solid #eee;padding-bottom:20px;margin: 25px 25px;}
.misc #contents .ranking h3 {font-weight: bold; font-size: 18px; color:#4fa3ce;margin: 25px 25px 10px;}
.misc #contents .ranking .text { margin: 15px 25px 5px;color: #313131; line-height: 1.8em; font-size: 14px;}
.misc #contents .ranking .price {color: #F36; font-size:16px; text-align: right; line-height: 1.4em; padding: 0 25px;}
.misc #contents .ranking a .fa {background-color: #fff;opacity : 0;transform : translate(0px, 25px);transition : all 500ms;text-align: center; position:absolute; bottom:-24px; left:50%; width: 48px; height: 48px; margin-left: -24px; font-size: 32px;color:#4fa3ce; line-height: 45px;padding-left: 2px;border-radius: 24px;-moz-border-radius: 24px;-webkit-border-radius: 24px;-o-border-radius: 24px;-ms-border-radius: 24px;}
.misc #contents .ranking a:hover .fa { opacity : 1; transform : translate(0, 0);}
@media screen and (max-width: 767px) {
    .misc #contents .ranking {margin-top: 0px!important;}
    .misc #contents .ranking .price {margin-bottom: 50px;}
}

.misc #contents.facility .montbell { margin: 50px 25px 0px;}
.misc #contents.climbing .montbell { margin: 0px 0px 0px;}
.misc #contents .montbell > img {margin-right: 50px;width:470px; height: auto; float: left;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
.misc #contents .montbell .text {padding-top: 100px; float: left;font-size: 14px; line-height: 2em;position: relative; display: block;width: 430px;height: 200px;}
.misc #contents .montbell .text h2 { font-size: 18px; color: #313131; font-weight: bold;margin-bottom:15px;}
.misc #contents .montbell .text > img { position: absolute; width: 280px;height: auto; top:20px; left: 0px;}
.misc #contents .montbell .text a {font-size: 14px;}
.misc #contents .montbell .text p {margin-top: 10px;}
@media screen and (max-width: 767px) {
    .misc #contents .montbell { margin: 0px 10px;}
    .misc #contents .montbell > img {margin-top: 25px;margin-right: 0px;width:100%; height: auto; float: none;}
    .misc #contents .montbell .text {padding:30px 25px 0px; float: none;font-size: 14px; line-height: 2em;position: relative; display: block;width: 100%;height: auto;}
    .misc #contents .montbell .text > img {display: block;position: inherit; width:240px;height: auto; top:inherit; left:inherit; margin: 0 auto 30px;}
    .misc #contents .montbell .text a {margin-top: 20px; display: block; text-align: center;}
}

.misc #contents .rankBtn {margin-top: -25px;}
.misc #contents .rankBtn a { position: relative;color:#1E3E4E; display: block;border: 3px solid #1E3E4E; height: 80px; line-height: 74px; text-align: center; font-size: 24px; font-weight: bold;}
.misc #contents .rankBtn a .fa { font-size: 50px; position: absolute; top: 10px; right: 20px;color:#1E3E4E }
.misc #contents .rankBtn a:hover { background-color:#1E3E4E; color: #fff;}
.misc #contents .rankBtn a:hover .fa { color: #fff;}
@media screen and (max-width: 767px) {
    .misc #contents .rankBtn {margin-top:0px;}
    .misc #contents .rankBtn a { height: auto; line-height: 1.6em; text-align: left; font-size: 18px; padding: 15px 25px;}
    .misc #contents .rankBtn a span { display: block;}
    .misc #contents .rankBtn a .fa { font-size: 42px; top: 20px;}
}

.misc #contents.souvenir {}
.misc #contents.souvenir .ranking {padding: 50px 50px 0px; margin: 0 auto; max-width: 1440px;}
.misc #contents.souvenir .list {padding: 0px 60px; margin: 0 auto; max-width: 1440px;}
.misc #contents.souvenir .list hr {margin: 50px 15px 75px;padding: 0; border-top: 1px solid #ccc;}
.misc #contents.souvenir .list .block { min-height: 500px; padding: 0 15px;display: block;}
.misc #contents.souvenir .list a {display: block;position: relative;}
.misc #contents.souvenir .list a .fa { position: absolute; bottom: 10px; right: 10px; color: #fff; font-size: 18px;}
.misc #contents.souvenir .list a .limit {z-index: 9;line-height: 20px;font-size: 11px; text-align: center; color: #FFF;width: 100px; height: 20px; display: block; position: absolute; top: -10px; right: 10px; background-color:#F36;opacity: 1;}
.misc #contents.souvenir .list h2 { font-weight: bold; font-size: 15px;margin-top: 25px;margin-bottom: 10px;}
.misc #contents.souvenir .list .text { font-size: 12px; line-height: 1.6em;margin-bottom: 10px; word-wrap: break-word;}
.misc #contents.souvenir .list .text .soldout {font-weight: bold;margin-left: 10px;}
.misc #contents.souvenir .list .price {color: #F36; font-size: 14px; text-align: right; line-height: 1.4em; }
@media screen and (max-width:1200px) {
    .misc #contents.souvenir .ranking {padding: 50px 25px;}
    .misc #contents.souvenir .list {padding: 0px 35px;}
    .misc #contents.souvenir .list .block { min-height: 430px; padding: 0 15px;}
}
@media screen and (max-width: 767px) {
    .misc #contents.souvenir .ranking {padding: 0px 0px 0px;}
    .misc #contents.souvenir .list {padding: 0px 15px;}
    .misc #contents.souvenir .list hr {margin: 0px -25px 50px;}
    .misc #contents.souvenir .list .block { height: 100%; padding: 0 10px;}
    .misc #contents.souvenir .list a .limit,
    .misc #contents.souvenir .list a .soldout{font-size: 10px;}
}

.misc #contents.climbing {}
.misc #contents.climbing .main {margin: 0 auto; max-width: 1440px;}
.misc #contents.climbing .ohachi {padding: 50px;}

.misc #contents .equipment {margin:25px -10px 75px;}
.misc #contents .equipment .block {padding: 10px;}
.misc #contents .equipment .block .inner { border: 1px solid #ccc; padding: 25px; min-height: 150px;display: block;}
.misc #contents .equipment .block figure {width: 100px; height: auto;margin-left: 20px; float: right;}
.misc #contents .equipment .block .text { font-size: 13px; line-height: 1.7em;}
.misc #contents .equipment .block .text h2 { font-size: 18px; margin-bottom: 12px; font-weight: bold;}
.misc #contents .equipment .btn {margin-top: 50px;}
@media screen and (max-width: 767px) {
    .misc #contents .equipment {margin:0px;}
    .misc #contents .equipment .block {padding: 10px;margin: 0 -10px;}
    .misc #contents .equipment .block .inner { padding: 20px; min-height: auto;}
    .misc #contents .equipment .block figure {width:80px; height: auto;}
    .misc #contents .equipment .block .text { font-size: 12px; line-height: 1.6em;}
    .misc #contents .equipment .block .text h2 { font-size: 16px; margin-bottom: 10px;}
    .misc #contents .equipment .btn {margin: 25px 0px 0px;}
}

.misc #contents .trakking {margin:25px -10px 50px;}
.misc #contents .trakking .block {padding: 10px;}
.misc #contents .trakking .block .inner { border: 1px solid #ccc; padding: 25px; min-height: 150px;display: block;}
.misc #contents .trakking .block figure {width: 300px; height: auto;margin-right: 25px; float: left;}
.misc #contents .trakking .block .text { font-size: 13px; line-height: 1.7em;}
.misc #contents .trakking .block .text h2 { margin-top: 10px;font-size: 18px; margin-bottom: 10px; font-weight: bold;}
.misc #contents .trakking .block .text p {color: #F36; font-size: 14px;margin-bottom: 20px;}
.misc #contents .trakking .btn {margin-top: 50px;}
@media screen and (max-width: 767px) {
    .misc #contents .trakking {margin:0px 0px 50px;}
    .misc #contents .trakking .block {padding: 10px;margin: 0 -10px;}
    .misc #contents .trakking .block figure {width:100%; height: auto;margin-right: 0px; float:none;margin-bottom: 25px;}
    .misc #contents .trakking .btn {margin: 25px 0px 0px;}
}

.misc #contents.etegami {}
.misc #contents.etegami .kaisai {position: relative;z-index: 9;margin: -30px 50px 0px;color:#FFF; display: block;background-color: #b51972;height: 60px; line-height: 57px; text-align: center; font-size: 24px; font-weight: bold;}
.misc #contents.etegami .kaisai span {font-size: 21px;margin-left: 50px;color:#f8f55a; }
.misc #contents.etegami .prize {margin: 50px -10px;}
.misc #contents.etegami .prize .block { margin: 0 10px;}
.misc #contents.etegami .prize .inner {background-color: #fff;border: 2px solid #937cb7; height: 100%;padding: 25px;}
.misc #contents.etegami .prize .inner h2 {color: #2D2637;text-align: center; font-size: 24px; font-weight: bold;margin-bottom: 15px;}
.misc #contents.etegami .prize .inner h2 span {margin-left: 25px;}
.misc #contents.etegami .prize .inner h3 {font-weight: bold;background-color:#937cb7; color: #fff; text-align: center; font-size: 18px;display: block;margin: 0 -25px;padding: 10px 0px;}
.misc #contents.etegami .prize .inner .text { line-height: 1.6em;margin-top: 15px; height: 85px;}
@media screen and (max-width:1200px) {
    .misc #contents.etegami .kaisai {margin: -30px 25px 0px;}
    .misc #contents.etegami .prize {margin-top: 25px;}

}
@media screen and (max-width: 767px) {
    .misc #contents.etegami .kaisai {padding: 20px 0px;position: relative;z-index: 9;margin: 0px ;color:#FFF; display: block;background-color: #b51972;height: auto; line-height: 1.6em; text-align: center; font-size: 18px; font-weight: bold;}
    .misc #contents.etegami .kaisai span {font-size: 16px;margin-left: 0px;display: block;}
    .misc #contents.etegami .prize {margin-top: 25px;margin-bottom: 5px;}
    .misc #contents.etegami .prize .inner {margin-bottom: 25px;}
    .misc #contents.etegami .btn {width:auto;margin: -25px -25px 25px;}
}

.accordion { width:100%;margin:0 0 50px;padding: 0;}
.accordion dt {background-image:none;background-repeat: no-repeat; background-position: right 20px top 29px; background-size: 20px; position: relative;background-color: #4fa3ce; color:#fff;line-height: 75px;padding-left: 50px;font-size:18px;cursor:pointer;display: block;margin-bottom: 1px;}
.accordion dt .fa {font-size: 36px; position: absolute; top: 20px; right: 20px;}
.accordion dt .fa-angle-down {display: block;}
.accordion dt span{position: relative;color: #fff;margin-right:50px; font-size: 21px;letter-spacing: 2px;font-family: 'Lato', sans-serif; font-weight: 700; }
.accordion dt span::after {content: '';position: absolute;top: 2px;right: -25px; width: 1px; height: 24px; background-color:#fff;transform: rotate(30deg);}
.accordion dt:hover{background-color: #1E3044;-webkit-transition: all .3s ease;transition: all .3s ease;}
.accordion dt.open {background-color: #1E3044;background-image: url(images/etegami/close.png); }
.accordion dt.open .fa-angle-down {display: none;}
.accordion dd { display: none;border: 1px solid #eee; border-top: none;margin: 0; padding: 50px 50px 25px;}
.accordion dd .block {padding-top: 50px;padding-bottom:0px!important;}
.accordion dd .table tr th {color: #313131; font-weight: bold; font-size: 21px; background-color: #eee;}
@media screen and (max-width: 767px) {
	.accordion { margin-top: 75px;}
    .accordion dt {line-height: 1.8em; font-size: 14px;padding: 10px 20px;}
    .accordion dt span{display: block; font-size: 14px; letter-spacing: 1px; font-weight: 400;opacity: 0.5;}
    .accordion dt span::after {display: none;}
    .accordion dd { display: none;border: 1px solid #eee; border-top: none;margin: 0; padding: 20px;}
    .accordion dt .fa {font-size: 30px; position: absolute; top: 20px; right: 20px;}
    .accordion dd .block {padding-top: 20px;padding-bottom:0px!important;}
    .accordion dt.open {background-color: #1E3044;background-image: url(images/etegami/close.png); background-size: 20px; background-position: right 20px top 25px;}
    .accordion dd .btn.std.min { width: 100px!important;margin: 0!important;padding: 0!important;float: none; position:inherit;top: inherit; bottom:inherit;}
}

.misc #contents.access {}
.misc #contents.access .address { text-align: center; font-size: 14px; margin-top: 20px;margin-bottom: 50px;}
.misc #contents.access .address .btn { margin-top: 10px;}
.misc #contents.access .fa-external-link {margin-right: 5px;font-size: 12px;color:#4fa3ce;}
.misc #contents.access .table-responsive {margin-bottom: 50px;}
.misc #contents.access .note {margin-top: -30px;}
@media screen and (max-width: 767px) {
    .misc #contents.access {padding-top: 0;}
    .misc #contents.access .mB100 {margin-bottom: 50px!important;}
    .misc #contents.access .address {font-size: 12px;}
}

.misc #contents.sightseeing {padding-top: 25px;}
.misc #contents.sightseeing h1.title { text-align: center; font-size: 32px;margin: 50px 0px 50px;}
.misc #contents.sightseeing .linkBox {margin-bottom: 25px;}
.misc #contents.sightseeing .linkBox a {font-size: 13px;color: #000;display: block; line-height: 1.8em; padding: 25px; border: 1px solid #ccc;}
.misc #contents.sightseeing .linkBox a figure { width: 150px; height: auto; float: left;margin-right: 25px;}
.misc #contents.sightseeing .linkBox a h2 { font-size: 16px; font-weight: bold;margin-bottom: 7px;}
.misc #contents.sightseeing .linkBox a .url {color: #ccc; font-size: 12px;margin-top: 5px; line-height: 1em;}
.misc #contents.sightseeing .linkBox a:hover { background-color: #fafafa; text-decoration: none; border: #4fa3ce 1px solid;}
@media screen and (max-width: 767px) {
    .misc #contents.sightseeing .linkBox a {line-height: 1.8em;padding: 20px;font-size: 12px;}
    .misc #contents.sightseeing .linkBox a figure { width: 110px; height: auto;margin-bottom: 10px;margin-right: 0px;margin-left: 15px;float: right;}
}

.misc #contents ul.sitemap {margin-bottom: 50px;}
.misc #contents ul.sitemap li {margin-top: 10px;display: block;}
.misc #contents ul.sitemap li:first-child {margin-top: 0px;}
.misc #contents ul.sitemap li a {position: relative;font-size:14px; color: #000;display: block;border: 1px solid #ccc; height: 50px; line-height: 50px;padding: 0 15px;transition: all .3s ease;-webkit-transition: all .3s ease;}
.misc #contents ul.sitemap li a .fa { position: absolute; top: 13px; right: 15px; font-size: 21px;}
.misc #contents ul.sitemap li a:hover {border: 1px solid #406690; background-color: #406690; text-decoration: none; color: #fff;}
@media screen and (max-width: 767px) {
    .misc #contents { padding-top:25px;}
    .misc #contents ul.sitemap {margin-bottom: 10px;}
}

/* news */
.misc #contents .row.post {padding-top: 25px;margin-top: 25px; border-top: 1px solid #eee;}
.misc #contents .row.post:first-child {padding-top: 0px;margin-top: 0px; border-top:none;}
.misc #contents .post .inner {display: block;}
.misc #contents .post .inner .text {font-size: 14px; line-height: 1.8em;}
.misc #contents .post .inner .date {color: #4fa3ce;font-size: 12px;display:block;width: 80px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px;margin-bottom: 5px;}
.misc #contents .post .inner h2 {font-size: 18px; font-weight: bold;margin-bottom: 15px;}
.misc #contents .post .inner h2 .new { font-size: 12px;margin-left: 15px; color: #BF0000;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 2px;}
@media screen and (max-width: 767px) {
    .misc #contents .post .inner {padding: 20px 20px 0px;}
}

.misc #contents .row .group {margin-top: 50px;}
.misc #contents .row .group figure {margin-bottom: 15px;}
.misc #contents .row .group h2 {font-weight: bold; font-size: 18px;}
.misc #contents .row .group .note {display: block;width: 150px; line-height: 20px; color: #fff; text-align: center; background-color: #4fa3ce;margin-bottom: 10px;}
.misc #contents .row .group .price {color: #F36; font-size: 14px; text-align: right;}
@media screen and (max-width: 767px) {
    .misc #contents .row .group {margin-top: 25px;}
}

/* --------------------------
 * MediaQuery
-------------------------- *

/* pc width min */
@media screen and (min-width: 1431px) {
    body,html {width: 100%; height: 100%;min-width: 1000px; min-height: 600px;}
    .container {width: 1000px;max-width: 1440px;-webkit-transition: all .3s ease;transition: all .3s ease;}
    .parent {display: flex;flex-direction: row;}
    .wrapper { overflow-x:hidden; }
    .sp_dspl { display:none!important;}
    .pc_dspl { display:block!important;}
    #spNav,#topNav {display: none;}
    .hamburger { display: none;}
    .spfoot {display: none;}

    /*h1.seo { line-height: 20px;color: #ccc; background-color: #eee; display: block;font-size: 10px; text-align: right; padding-right: 50px;}*/
    #header { min-width: 1000px;width: 100%; height: 130px;display: block;position: absolute; top: 0px; left: 0px;z-index: 1; background-color: rgba(255, 255, 255, 0);}
    #header .inner {height: 130px; width: 100%;min-width: 1000px;display: block; margin: 0px auto 0px; position: relative; background-color: #FFFFFF;; color: #000000;}
    #header .inner .logo { position: absolute; bottom:30px;left: 50px;width: 180px; height:auto; display: block;z-index: 99;}
    #header .inner .logo a {width: 180px; height: auto; display: block;}
    #header .inner .logo img {width: 180px; height: auto;display: block;-webkit-transition: all .3s ease;transition: all .3s ease;}

    #header .inner .facebook { position: absolute; bottom:30px;left: 250px;width: 30px; height:auto; display: block;z-index: 99;}
    #header .inner .facebook a {width: 30px; height: auto; display: block;}
    #header .inner .facebook img {width: 30px; height: auto;display: block;-webkit-transition: all .3s ease;transition: all .3s ease;}

    #header .inner .insta { position: absolute; bottom:31px;left: 285px;width: 40px; height:auto; display: block;z-index: 99; top: 66px;}
    #header .inner .insta a {width: 41px; height: auto; display: block;}
    #header .inner .insta img {width: 41px; height: auto;display: block;-webkit-transition: all .3s ease;transition: all .3s ease;}


    #header .subnav {position: absolute;; top: 0px; right:50px;}
    #header .subnav ul {}
    #header .subnav ul li {display:block; float: left;margin-left: 10px;}
    #header .subnav ul li a {display:block; color: #FFF; font-size: 12px; padding: 0 20px; background-color:#4fa3ce;line-height: 27px;border-bottom-left-radius: 3px;-webkit-border-bottom-left-radius: 3px;border-bottom-right-radius: 3px;-webkit-border-bottom-right-radius: 3px;}
    #header .subnav ul li a:hover { text-decoration: none; background-color: rgba(79,163,206,0.7);color: #fff;}

    #header .inner .gnav {height:90px; position: absolute; right: 40px; bottom: 0px;}
    #header .inner .gnav ul { height: 70px;}
    #header .inner .gnav ul li {cursor: pointer;text-align: right;display: inline-block;position: relative;}
    #header .inner .gnav ul li:first-child a:after { display: none;}
    #header .inner .gnav ul li::after {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 3px;-webkit-transform: scaleX(0);-ms-transform: scaleX(0);transform: scaleX(0);background-color:#4fa3ce;-webkit-transition: all .3s ease;transition: all .3s ease;}
    #header .inner .gnav ul li:hover::after {-webkit-transform: scaleX(1);-ms-transform: scaleX(1);transform: scaleX(1);}
    #header .inner .gnav ul li a {height:70px; padding: 0 15px;font-size: 16px;color: #000000;text-align: center; font-weight: bold; display: block; position: relative;z-index: 9; padding-top: 10px; border-radius: 30px;}
    #header .inner .gnav ul li a span {color:#4fa3ce;font-size: 10px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px; display: block;line-height: 1em;margin-top: 5px;margin-left: 1px;}
    #header .inner .gnav ul li a:hover,
    #header .inner .gnav ul li a:focus,
    #header .inner .gnav ul li a:active { text-decoration: none;}
    #header .inner .gnav ul li.subMenu {display: inline-block; position: relative;}
    #header .inner .gnav ul li.subMenu > ul { padding:25px; z-index: 999;display:none;position: absolute;left:0px; top:70px;width: 300px; height: auto;background: #FFF; z-index: 9999;box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-o-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-ms-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);}
    #header .inner .gnav ul li.subMenu > ul > li {display: block;margin: 0;padding: 0; height: inherit;line-height: inherit;margin-top: 20px;}
    #header .inner .gnav ul li.subMenu > ul > li:first-child {margin-top: 0;}
    #header .inner .gnav ul li.subMenu > ul > li::after {display: none;}
    #header .inner .gnav ul li.subMenu > ul > li > a { height: auto;margin: 0;padding: 0; letter-spacing: 0px;position: relative;text-align: left;font-size: 14px;font-weight: normal;display: block; color: #000000; background-color:#ffffff;}
    #header .inner .gnav ul li.subMenu > ul > li > a > .fa {font-size: 18px; position: absolute; top: 50%; right: 0px; margin-top: -9px;-webkit-transition: all .3s ease;transition: all .3s ease;}
    #header .inner .gnav ul li.subMenu > ul > li > a:hover {font-weight: bold;-webkit-transition: all .3s ease;transition: all .3s ease;}
    #header .inner .gnav ul li.subMenu > ul > li > a:hover .fa { position: absolute; top: 50%; right: -5px;color:#4fa3ce;}

    #header.fixed {height: 0px; position: fixed; top: 0; left: 0;z-index: 9999;background-color: transparent;}
    #header.fixed .inner .logo { position: absolute; top: 15px;left: 50px; width: 120px; height: auto; display: block;}
    #header.fixed .inner .logo img {width: 120px; height: auto;}

    #header.fixed .inner .facebook { position: absolute; top: 42px;left: 180px; width: 50px; height: auto; display: block;}
    #header.fixed .inner .facebook img {width: 25px; height: auto;}

    #header.fixed .inner .gnav ul li a {height:70px; padding: 0 15px;font-size: 16px;color: #000000;text-align: center; font-weight: bold; display: block; position: relative;z-index: 9; padding-top: 10px; border-radius: 30px;}

    #header.fixed .inner .insta { position: absolute; top: 38px;left: 208px; width: 50px; height: auto; display: block;}
    #header.fixed .inner .insta img {width: 35px; height: auto;}

    #header.fixed .inner .gnav {height:70px; position: absolute; right: 40px; top: 10px;}
    #header.fixed .subnav {display: none;}
    #header.fixed .inner {display: block;width: 100%;height: 90px;position: fixed;top:-90px; left: 0; z-index: 999;transition: .3s;transform: translateY(90px);box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-moz-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-o-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-ms-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2); background-color: rgba( 255, 255, 255, 0.75 ); color: #000000;}
    @media screen and (max-width: 1200px) {
        #header .inner .logo { position: absolute; bottom:35px;left: 50px;width: 150px; height:auto; display: block;z-index: 99;}
        #header .inner .logo a {width: 150px; height: auto; display: block;}
        #header .inner .logo img {width: 150px; height: auto;display: block;}
        #header .inner .gnav ul li a {padding: 0 10px;font-size: 14px;}
        #header .inner .gnav ul li a span {letter-spacing: 0px;}
        #header .inner h1 { display: none;}
    }

    @media screen and (max-width: 1200px) {
        #header .inner .facebook { position: absolute; bottom:34px;left: 220px;width: 30px; height:auto; display: block;z-index: 99;}
        #header .inner .facebook a {width: 30px; height: auto; display: block;}
        #header .inner .facebook img {width: 30px; height: auto;display: block;}
        #header .inner .gnav ul li a {padding: 0 10px;font-size: 14px;}
        #header .inner .gnav ul li a span {letter-spacing: 0px;}
        #header .inner h1 { display: none;}
    }

    @media screen and (max-width: 1200px) {
        #header .inner .insta { position: absolute; top: 62px; bottom:35px;left: 253px;width: 40px; height:auto; display: block;z-index: 99;}
        #header .inner .insta a {width: 41px; height: auto; display: block;}
        #header .inner .insta img {width: 41px; height: auto;display: block;}
        #header .inner .gnav ul li a {padding: 0 10px;font-size: 14px;}
        #header .inner .gnav ul li a span {letter-spacing: 0px;}
        #header .inner h1 { display: none;}
    }

    #header-note { display:none; }

}


@media screen and (min-width:769px) and (max-width:1430px) {
    body,html {width: 100%; height: 100%;min-width: 1000px; min-height: 600px;}
    .container {width: 1000px;max-width: 1440px;-webkit-transition: all .3s ease;transition: all .3s ease;}
    .parent {display: flex;flex-direction: row;}
    .wrapper { overflow-x:hidden; }
    .sp_dspl { display:none!important;}
    .pc_dspl { display:block!important;}
    #spNav,#topNav {display: none;}
    .hamburger { display: none;}
    .spfoot {display: none;}

    /*h1.seo { line-height: 20px;color: #ccc; background-color: #eee; display: block;font-size: 10px; text-align: right; padding-right: 50px;}*/
    #header-note { min-width: 1000px;width: 100%; height: 130px;display: block;position: absolute; top: 0px; left: 0px;z-index: 1; background-color: rgba(255, 255, 255, 0);}
    #header-note .inner {height: 130px; width: 100%;min-width: 1000px;display: block; margin: 0px auto 0px; position: relative; background-color:#FFFFFF; color: #000000;}
    #header-note .inner .logo { position: absolute; bottom:30px;left: 50px;width: 180px; height:auto; display: block;z-index: 99;}
    #header-note .inner .logo a {width: 180px; height: auto; display: block;}
    #header-note .inner .logo img {width: 180px; height: auto;display: block;-webkit-transition: all .3s ease;transition: all .3s ease;}

    #header-note .inner .facebook { position: absolute; bottom:30px;left: 250px;width: 30px; height:auto; display: block;z-index: 99;}
    #header-note .inner .facebook a {width: 30px; height: auto; display: block;}
    #header-note .inner .facebook img {width: 30px; height: auto;display: block;-webkit-transition: all .3s ease;transition: all .3s ease;}

    #header-note .inner .insta { position: absolute; bottom:31px;left: 285px;width: 40px; height:auto; display: block;z-index: 99; top: 66px;}
    #header-note .inner .insta a {width: 41px; height: auto; display: block;}
    #header-note .inner .insta img {width: 41px; height: auto;display: block;-webkit-transition: all .3s ease;transition: all .3s ease;}


    #header-note .subnav {position: absolute;; top: 0px; right:50px;}
    #header-note .subnav ul {}
    #header-note .subnav ul li {display:block; float: left;margin-left: 10px;}
    #header-note .subnav ul li a {display:block; color: #FFF; font-size: 12px; padding: 0 20px; background-color:#4fa3ce;line-height: 27px;border-bottom-left-radius: 3px;-webkit-border-bottom-left-radius: 3px;border-bottom-right-radius: 3px;-webkit-border-bottom-right-radius: 3px;}
    #header-note .subnav ul li a:hover { text-decoration: none; background-color: rgba(79,163,206,0.7);color: #fff;}

    #header-note .inner .gnav {height:120px; position: absolute; right: 40px; bottom: 0px; text-align: center;}
    #header-note .inner .gnav ul { height: 60px;}
    #header-note .inner .gnav ul li {cursor: pointer;text-align: right;display: inline-block;position: relative;}
    #header-note .inner .gnav ul li:first-child a:after { display: none;}
    #header-note .inner .gnav ul li::after {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 3px;-webkit-transform: scaleX(0);-ms-transform: scaleX(0);transform: scaleX(0);background-color:#4fa3ce;-webkit-transition: all .3s ease;transition: all .3s ease;}
    #header-note .inner .gnav ul li:hover::after {-webkit-transform: scaleX(1);-ms-transform: scaleX(1);transform: scaleX(1);}
    #header-note .inner .gnav ul li a {height:50px; padding: 0 15px;font-size: 16px;color: #FFFFFF;text-align: center; font-weight: bold; display: block; position: relative;z-index: 9; padding-top: 2px; border-radius: 30px; color: #000000;}
    #header-note .inner .gnav ul li a span {color:#4fa3ce;font-size: 10px;font-family: 'Lato', sans-serif; font-weight: 400; letter-spacing: 1px; display: block;line-height: 1em;margin-top: 5px;margin-left: 1px;}
    #header-note .inner .gnav ul li a:hover,
    #header-note .inner .gnav ul li a:focus,
    #header-note .inner .gnav ul li a:active { text-decoration: none;}
    #header-note .inner .gnav ul li.subMenu {display: inline-block; position: relative;}
    #header-note .inner .gnav ul li.subMenu > ul { padding:25px; z-index: 999;display:none;position: absolute;left:0px; top:50px;width: 300px; height: auto;background: #FFF; z-index: 9999;box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-o-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);-ms-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);}
    #header-note .inner .gnav ul li.subMenu > ul > li {display: block;margin: 0;padding: 0; height: inherit;line-height: inherit;margin-top: 20px;}
    #header-note .inner .gnav ul li.subMenu > ul > li:first-child {margin-top: 0;}
    #header-note .inner .gnav ul li.subMenu > ul > li::after {display: none;}
    #header-note .inner .gnav ul li.subMenu > ul > li > a { height: auto;margin: 0;padding: 0; letter-spacing: 0px;position: relative;text-align: left;font-size: 14px;font-weight: normal;display: block; color: #000000;}
    #header-note .inner .gnav ul li.subMenu > ul > li > a > .fa {font-size: 18px; position: absolute; top: 50%; right: 0px; margin-top: -9px;-webkit-transition: all .3s ease;transition: all .3s ease;}
    #header-note .inner .gnav ul li.subMenu > ul > li > a:hover {font-weight: bold;-webkit-transition: all .3s ease;transition: all .3s ease;}
    #header-note .inner .gnav ul li.subMenu > ul > li > a:hover .fa { position: absolute; top: 50%; right: -5px;color:#4fa3ce;}

    #header-note.fixed {height: 0px; position: fixed; top: 0; left: 0;z-index: 9999;background-color: transparent;}
    #header-note.fixed .inner .logo { position: absolute; bottom:35px; left: 50px; width: 150px; height: auto; display: block;}
    #header-note.fixed .inner .logo img {width: 150px; height: auto;}

    #header-note.fixed .inner .facebook { position: absolute; bottom: 34px; left: 220px; width: 30px; height: auto; display: block;}
    #header-note.fixed .inner .facebook img {width: 30px; height: auto;}

    #header-note.fixed .inner .insta { position: absolute; top: 72px; bottom:35px; left: 253px; width: 40px; height: auto; display: block;}
    #header-note.fixed .inner .insta img {width: 40px; height: auto;}

    #header-note.fixed .inner .gnav {height:70px; position: absolute; right: 40px; top: 20px;}
    #header-note.fixed .subnav {display: none;}
    #header-note.fixed .inner {display: block;width: 100%;height: 140px;position: fixed;top:-90px; left: 0; z-index: 999;transition: .3s;transform: translateY(90px);box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-moz-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-o-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-ms-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2); background-color: rgba( 255, 255, 255, 0.75 ); color: #000000;}
    @media screen and (max-width: 1200px) {
        #header-note .inner .logo { position: absolute; bottom:35px;left: 50px;width: 150px; height:auto; display: block;z-index: 99;}
        #header-note .inner .logo a {width: 150px; height: auto; display: block;}
        #header-note .inner .logo img {width: 150px; height: auto;display: block;}
        #header-note .inner .gnav ul li a {padding: 0 10px;font-size: 14px;}
        #header-note .inner .gnav ul li a span {letter-spacing: 0px;}
        #header-note .inner h1 { display: none;}
    }

    @media screen and (max-width: 1200px) {
        #header-note .inner .facebook { position: absolute; bottom:34px;left: 220px;width: 30px; height:auto; display: block;z-index: 99;}
        #header-note .inner .facebook a {width: 30px; height: auto; display: block;}
        #header-note .inner .facebook img {width: 30px; height: auto;display: block;}
        #header-note .inner .gnav ul li a {padding: 0 10px;font-size: 14px;}
        #header-note .inner .gnav ul li a span {letter-spacing: 0px;}
        #header-note .inner h1 { display: none;}
    }

    @media screen and (max-width: 1200px) {
        #header-note .inner .insta { position: absolute; top: 62px; bottom:35px;left: 253px;width: 40px; height:auto; display: block;z-index: 99;}
        #header-note .inner .insta a {width: 41px; height: auto; display: block;}
        #header-note .inner .insta img {width: 41px; height: auto;display: block;}
        #header-note .inner .gnav ul li a {padding: 0 10px;font-size: 14px;}
        #header-note .inner .gnav ul li a span {letter-spacing: 0px;}
        #header-note .inner h1 { display: none;}
    }

    #header { display:none; }
}





/* smartphone */
@media screen and (max-width: 767px) {
    body,html {-webkit-overflow-scrolling: touch;overflow-x: hidden;}
    a:hover { text-decoration: none;}
    .sp_dspl { display:block!important;}
    .pc_dspl { display:none!important;}
    .container { width:100%;margin:0; padding: 0 25px;}
    #contents {display: block;}
    #link { display: none;}
    .parent {display:inherit;flex-direction: inherit;}

    body,html {overflow-x: hidden;display: block;position: relative;}

    #header {width: 100%;height: 70px;background-color: #FFF; position: fixed; top: 0; left: 0; z-index: 9999;box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-moz-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-o-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);-ms-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2);}
    #header .inner .logo { position: absolute; top: 16px;left: 20px;width: 100px; height: auto; display: block;z-index: 99;}
    #header .inner .logo a {width: 200px; height: 34px; display: block; background-color:transparent;transition:none;-webkit-transition:none;}
    #header .inner .logo img { position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto;width: 100%; height: auto;display: block;}

    #header .inner .facebook { position: absolute; top: 27px;left: 130px;width: 22px; height: auto; display: block;z-index: 99;}
    #header .inner .facebook a {width: 80px; height: 34px; display: block; background-color:transparent;transition:none;-webkit-transition:none;}
    #header .inner .facebook img { position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto;width: 100%; height: auto;display: block;}

    #header .inner .insta { position: absolute; top: 28px;left: 153px;width: 30px; height: auto; display: block;z-index: 99;}
    #header .inner .insta a {width: 81px; height: 34px; display: block; background-color:transparent;transition:none;-webkit-transition:none;}
    #header .inner .insta img { position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto;width: 100%; height: auto;display: block;}

    #header .inner .gnav,
    #header .subnav {display: none;}
    #header .hamburger { cursor:pointer;display: block; position: absolute; top: 0; right: 0; height: 70px; width: 70px;transition: all .3s ease;-webkit-transition: all .3s ease;}
    #header .hamburger figure { padding: 23px 22px;}

    .spfoot { position: fixed; bottom:0; width: 100%; left: 0; height: 70px; background-color: rgba(0,0,0,0.7);z-index: 999;}
    .spfoot ul {margin: 0 10px;}
    .spfoot ul li { width: 50%; height: 70px;display: block; float: left;}
    .spfoot ul li a { width: 100; height: 40px;display: block;margin: 15px 5px; color: #fff; font-size: 11px;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;-o-border-radius: 3px;-ms-border-radius: 3px;}
    .spfoot ul li a span { line-height: 40px;}
    .spfoot ul li a img {display: block;width:20px; margin:10px 15px 10px 10px;float: left;}
    .spfoot ul li.tel_stay a { background-color:#4fa3ce;}
    .spfoot ul li.tel_meal a  { background-color:#8bb254; }

    #topNav {display: block; background-color:#eee;padding: 15px;}
    #topNav ul {margin-bottom: 1px;margin-left: -1px;}
    #topNav ul li { width: 33.3%;float: left; display: block;}
    #topNav ul li a {background-color: #fff;padding: 20px 0px;text-align: center;font-size: 10px;font-weight: bold;display: block; color: #444;border-left: 1px solid #eee;border-top:1px solid #eee; transition: all .3s ease;-webkit-transition: all .3s ease;}
    #topNav ul li a span {display: block;font-family: 'Lato', sans-serif;font-weight: 400;letter-spacing: 1px; font-size: 10px;line-height: 1em;margin-top: 2px;opacity: 0.5; color: #4fa3ce;}
    #topNav ul li a img {width: 40px; height: auto;display: block;margin: 0px auto 10px;}
    #topNav ul li a:hover { background-color: #fafafa;}

    #spNav {padding: 50px 0px 50px;display:none; background-color:#4fa3ce;z-index: 9999; position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow-y: auto;}
    #spNav > ul.nav {padding: 50px 25px 0; text-align: center;}
    #spNav > ul.nav li {display: block;line-height: 50px;}
    #spNav > ul.nav li ul {margin-bottom: 50px;}
    #spNav > ul.nav li ul li {border-bottom: 1px solid rgba(0,0,0,0.2);}
    #spNav > ul.nav li {font-size: 18px;font-weight: bold;color: #fff; text-align: left;display: block;padding: 0px; position: relative;}
    #spNav > ul.nav li h2 {font-size: 18px; color: #fff;padding: 0 20px; font-weight: bold; background-color: rgba(0,0,0,0.2);}
    #spNav > ul.nav li h2 span {position: absolute; right: 20px; top: 0px;margin-left: 25px;font-family: 'Lato', sans-serif;font-weight: 400;letter-spacing: 2px; font-size: 10px;}
    #spNav > ul.nav li a{color: #FFF; padding: 0 20px;display: block; font-size: 14px;}
    #spNav > ul.nav li a:hover{background-color: rgba(0,0,0,0.1);}
    #spNav > ul.nav li a:hover,
    #spNav > ul.nav li a:focus,
    #spNav > ul.nav li a:active { text-decoration: none;}
    #spNav > ul.nav li a .fa {margin-right: 20px; position: absolute; right: 0; font-size: 24px; top: 12px;}
    #spNav .btn { text-align: center;margin: 0px auto;display: block;border: 1px solid #fff; width: 150px;}
    #spNav .btn a {display: block;width: 150px;font-size:14px;color: #fff;font-family: 'Lato', sans-serif; font-weight: 400;letter-spacing: 2px;line-height: 30px;}

    #header-note { display:none; }

}

.fotter_text { margin: 0 80px; width: auto; text-align: center; }
.fotter_textdetails { text-align: left; display: inline-block; }