@charset "utf-8"; /* reset -----------------------------------------------------------------------*/ #customer_header, #customer_header div, #customer_header span, #customer_header object, #customer_header iframe, #customer_header h1, #customer_header h2, #customer_header h3, #customer_header h4, #customer_header h5, #customer_header h6, #customer_header p, #customer_header blockquote, #customer_header pre, #customer_header abbr, #customer_header address, #customer_header cite, #customer_header code, #customer_header del, #customer_header dfn, #customer_header em, #customer_header img, #customer_header ins, #customer_header kbd, #customer_header q, #customer_header samp, #customer_header small, #customer_header strong, #customer_header sub, #customer_header sup, #customer_header var, #customer_header b, #customer_header i, #customer_header dl, #customer_header dt, #customer_header dd, #customer_header ol, #customer_header ul, #customer_header li, #customer_header fieldset, #customer_header form, #customer_header label, #customer_header legend, #customer_header table, #customer_header caption, #customer_header tbody, #customer_header tfoot, #customer_header thead, #customer_header tr, #customer_header th, #customer_header td, #customer_header article, #customer_header aside, #customer_header dialog, #customer_header figure, #customer_header footer, #customer_header header, #customer_header hgroup, #customer_header menu, #customer_header nav, #customer_header section, #customer_header time, #customer_header mark, #customer_header audio, #customer_header video, #customer_footer, #customer_footer div, #customer_footer span, #customer_footer object, #customer_footer iframe, #customer_footer h1, #customer_footer h2, #customer_footer h3, #customer_footer h4, #customer_footer h5, #customer_footer h6, #customer_footer p, #customer_footer blockquote, #customer_footer pre, #customer_footer abbr, #customer_footer address, #customer_footer cite, #customer_footer code, #customer_footer del, #customer_footer dfn, #customer_footer em, #customer_footer img, #customer_footer ins, #customer_footer kbd, #customer_footer q, #customer_footer samp, #customer_footer small, #customer_footer strong, #customer_footer sub, #customer_footer sup, #customer_footer var, #customer_footer b, #customer_footer i, #customer_footer dl, #customer_footer dt, #customer_footer dd, #customer_footer ol, #customer_footer ul, #customer_footer li, #customer_footer fieldset, #customer_footer form, #customer_footer label, #customer_footer legend, #customer_footer table, #customer_footer caption, #customer_footer tbody, #customer_footer tfoot, #customer_footer thead, #customer_footer tr, #customer_footer th, #customer_footer td, #customer_footer article, #customer_footer aside, #customer_footer dialog, #customer_footer figure, #customer_footer footer, #customer_footer header, #customer_footer hgroup, #customer_footer menu, #customer_footer nav, #customer_footer section, #customer_footer time, #customer_footer mark, #customer_footer audio, #customer_footer video { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; } /* heading -----------------------------------------------------------------------*/ #customer_header article, #customer_header aside, #customer_header dialog, #customer_header figure, #customer_header footer, #customer_header header, #customer_header h1, #customer_header h2, #customer_header h3, #customer_header h4, #customer_header h5, #customer_header h6, #customer_footer article, #customer_footer aside, #customer_footer dialog, #customer_footer figure, #customer_footer footer, #customer_footer header, #customer_footer h1, #customer_footer h2, #customer_footer h3, #customer_footer h4, #customer_footer h5, #customer_footer h6 { font-weight: normal; } /* HTML5 -----------------------------------------------------------------------*/ #customer_header hgroup, #customer_header nav, #customer_header section, #customer_footer hgroup, #customer_footer nav, #customer_footer section { display: block; } /* list -----------------------------------------------------------------------*/ #customer_header ol, #customer_header ul, #customer_header dl, #customer_header li, #customer_footer ol, #customer_footer ul, #customer_footer dl, #customer_footer li { list-style: none; padding: 0; margin: 0; } /* table -----------------------------------------------------------------------*/ #customer_header caption, #customer_header th, #customer_footer caption, #customer_footer th { text-align: left; font-weight: normal; font-size: 100%; } #customer_header table, #customer_footer table { border-collapse: collapse; border-spacing: 0; } /* form -----------------------------------------------------------------------*/ #customer_header input, #customer_header textarea, #customer_header select, #customer_footer input, #customer_footer textarea, #customer_footer select { font-family: inherit; font-size: inherit; font-weight: inherit; border: 1px solid #ccc; border-radius: 0; } /* link -----------------------------------------------------------------------*/ #customer_header a, #customer_footer a { outline: none; margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-decoration: none; color: #452A21; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } #customer_header a:hover, #customer_footer a:hover { opacity: 0.8; } /* image -----------------------------------------------------------------------*/ #customer_header img, #customer_footer img { border: 0; vertical-align: middle; display: inline-block; max-width: 100%; height: auto; /* width: auto; */ } /* Body -----------------------------------------------------------------------*/ @font-face { font-family: "Custom Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 100; } @font-face { font-family: "Custom Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 200; } @font-face { font-family: "Custom Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 300; } @font-face { font-family: "Custom Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 400; } @font-face { font-family: "Custom Yu Gothic"; src: local("Yu Gothic Bold"); font-weight: bold; } @font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 100; } @font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 200; } /* body相当のスタイル -----------------------------------------------------------------------*/ #customer_header, #customer_footer { position: relative; z-index: 0; color: #452A21; background: url(https://www.toba-kisara.com/kisara/img/com/body_bg.gif) 0 0 repeat; line-height: 1.6; -webkit-print-color-adjust: exact; word-break: break-all; font-family: 'Noto Sans JP', "-apple-system", "Helvetica Neue", "Custom Yu Gothic", YuGothic, Verdana, "Yu Gothic Medium", "游ゴシック Medium", "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, sans-serif; -webkit-text-size-adjust: 100%; font-size: 150%;} } /* box-sizing -----------------------------------------------------------------------*/ #customer_header, #customer_header *, #customer_header::before, #customer_header::after, #customer_header *::before, #customer_header *::after, #customer_footer, #customer_footer *, #customer_footer::before, #customer_footer::after, #customer_footer *::before, #customer_footer *::after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } #webc_con{margin-top: 60px;} @media screen and (max-width: 768px) { #webc_con{margin-top: 80px;} } /* header ■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□ -----------------------------------------------------------------------*/ /*　ナビゲーション　*/ #customer_header #comHeaderBox .spRsvBtn{display:none;} #customer_header #comHeaderBox {position:fixed;z-index:9000;top: -80px;right:0;width:100%;background:#0F1E17;-webkit-transition:all .35s ease; -moz-transition:all .35s ease; -ms-transition:all .35s ease; -o-transition:all .35s ease; transition:all .35s ease;} #customer_header #comHeaderBox .inner{position:relative;margin:0 auto;max-width: 1800px;} #customer_header #comHeaderBox h1{font-size:14px;float:left;width:110px;} #customer_header #comHeaderBox a{color:#ddd;} #customer_header #comHeaderBox .mainNav{position:absolute;top:25px;left:150px;} #customer_header #comHeaderBox .mainNav ul{display:table;margin:0 auto;width:100%;max-width:990px;table-layout:fixed;} #customer_header #comHeaderBox .mainNav li{display:table-cell;vertical-align: middle; text-align:center;} #customer_header #comHeaderBox .mainNav li a{position:relative;display:inline-block;color:#ddd;font-size:16px;} #customer_header #comHeaderBox .mainNav li a::after {position: absolute;bottom: -4px;left: 0;content: '';width: 100%;height: 1px;background: #ddd;transform: scale(0, 1);transform-origin: right top;transition: transform .3s;} #customer_header #comHeaderBox .mainNav li a:hover::after {transform-origin: left top;transform: scale(1, 1);} #customer_header #comHeaderBox .contactNavBox{display: flex;flex-direction:column-reverse;width: 205px;position: absolute;top: 0;right: 0;} #customer_header #comHeaderBox .contactNav ul{position:relative; overflow:hidden;} #customer_header #comHeaderBox .contactNav li{float:left;padding-top:5px;font-size:18px;margin-left:10px;} #customer_header #comHeaderBox .contactNav li:last-child{margin-right:0;} #customer_header #comHeaderBox .contactNav .contact a, #customer_header #comHeaderBox .contactNav .reserve2 a{font-size:15px;text-decoration: underline;} #customer_header #comHeaderBox .contactNav .contact a:hover, #customer_header #comHeaderBox .contactNav .reserve2 a:hover{text-decoration:none;} #customer_header #comHeaderBox .contactNav .modalLink{padding-top: 7px;margin-left:40px;} #customer_header #comHeaderBox .contactNav .modalLink a{font-size:18px;letter-spacing:.1em;} #customer_header #comHeaderBox .contactNav .modalLink a:hover{opacity:0.75;} #customer_header #comHeaderBox .contactNav .modalLink a:after{content:'/';padding:0 5px;} #customer_header #comHeaderBox .contactNav .modalLink a:last-child:after{content:none;} #customer_header #comHeaderBox .contactNavBox .btn{padding:0;width:205px;} #customer_header #comHeaderBox .contactNavBox .btn a{font-size:16px;padding:2px 14px 5px;line-height:2;background:#ddd;color:#0F1E17;display:block;border-radius:0 0 3px 3px;} #customer_header #comHeaderBox .contactNavBox .btn a span{font-size:12px;} #customer_header #comHeaderBox .contactNav i{font-size:14px;vertical-align:top;padding:10px 3px 0 0;} #customer_header #comHeaderBox .tel {color:#ddd;padding-top:5px;position: absolute;top: 40px;right: 0;} #customer_header #comHeaderBox .tel .time{font-size:15px;} #customer_header #comHeaderBox .tel .time span{font-size:12px;} #customer_header #comHeaderBox .tel .num{margin-left:8px;} #customer_header #comHeaderBox .tel a{letter-spacing:1.5px;font-size:18px;} #customer_header #comHeaderBox .babyLink {position:fixed;z-index:9000;right:-50px;top:100px;height:155px;width:50px;} #customer_header #comHeaderBox .babyLink a{color:#fff;border-radius:3px 0 0 3px;display:block;width:100%;text-align:center;padding:15px 0;background:#F29C9F;} #customer_header #comHeaderBox .onenessLink {position:fixed;z-index:9000;right:-50px;top:265px;height:134px;width:50px;} #customer_header #comHeaderBox .onenessLink a{color:#fff;border-radius:3px 0 0 3px;display:block;width:100%;text-align:center;padding:15px 0;background:#b99361;} #customer_header #comHeaderBox .dogLink {position:fixed;z-index:9000;right:-50px;top:409px;height:155px;width:50px;} #customer_header #comHeaderBox .dogLink a{color:#fff;border-radius:3px 0 0 3px;display:block;width:100%;text-align:center;padding:15px 0;background:#c1835d;} #customer_header #tripAi{position:fixed;z-index:900 !important;bottom:0;right:10px;width:150px;} #customer_header #subPageHeader #comHeaderBox{top:0;} /* 予約ドロップダウンボタン */ #customer_header #comHeaderBox .contactNavBox .dropdown__lists {visibility: hidden;opacity: 0;transition: all .3s;width:100%;position: absolute;top:40px;right:0;max-width: 205px;z-index:10;} #customer_header #comHeaderBox .dropdown__lists {visibility: hidden;opacity: 0;transition: all .3s;width:100%;position: absolute;top:47px;right: 50px;max-width: 188px;} #customer_header #comHeaderBox .gnavi__wrap{z-index:1000;} #customer_header #comHeaderBox .gnavi__list:hover .dropdown__lists{visibility: visible;opacity: 1;} #customer_header #comHeaderBox .dropdown__list{transition: all .3s;position: relative;border: 1px solid #624f49;} #customer_header #comHeaderBox .dropdown__list i{margin-right:5px;} #customer_header #comHeaderBox .dropdown__list:not(:first-child)::before{content: "";width: 100%;height: 1px;background-color: #ddd;position: absolute;top: 0;left: 0;} #customer_header #comHeaderBox .dropdown__list:hover {background-color:#695248;opacity:1!important;} #customer_header #comHeaderBox .dropdown__list a{background:#452A21!important;display: flex;justify-content:flex-start;align-items: center;color: #fff;text-decoration: none;position: relative;border-radius:0!important;padding: 10px 10px!important;font-size:14px;} #customer_header #comHeaderBox .init-bottom:after {content: '';display: inline-block;width: 6px;height: 6px;margin: 0 0 5px 10px;border-right: 1px solid #0F1E17;border-bottom: 1px solid #0F1E17;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);} /* メニューボタン */ #customer_header .spBtn {display: block;position: absolute;top:16px;right:0; width:28px; height: 35px; cursor: pointer; z-index: 9000;} #customer_header .spBtn div {position: relative;text-align:center;} #customer_header .spBtn span {display: block; position: absolute; height: 2px; width: 100%; background:#ddd; left: 0;-webkit-transition: .15s ease-in-out; -moz-transition: .15s ease-in-out; transition: .15s ease-in-out;} #customer_header .spBtn span:nth-child(1) { top: 10px;} #customer_header .spBtn span:nth-child(2) { top: 21px;} /* メニューボタン 切り替えアニメーション */ #customer_header .open.spBtn span:nth-child(1) {top: 14px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);} #customer_header .open.spBtn span:nth-child(2) {top: 14px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg);} @media screen and (max-width:1550px){ #customer_header #comHeaderBox .mainNav{left:130px;} #customer_header #comHeaderBox .mainNav ul{max-width:820px;} #customer_header #comHeaderBox .mainNav li a{font-size:16px;} } @media screen and (max-width:1300px){ #customer_header #comHeaderBox .mainNav ul{max-width:700px;} #customer_header #comHeaderBox .mainNav li a{font-size:14px;} } @media screen and (min-width:1185px){ #customer_header #comHeaderBox .spBtn {display:none!important;} #customer_header #comHeaderBox .spNavBtn{display:none;} } @media screen and (max-width:1184px){ #customer_header #comHeaderBox {height:62px;} #customer_header #comHeaderBox h1 img{width:80px;} #customer_header #comHeaderBox .inner{width:90%;} #customer_header #comHeaderBox nav{display:none;} #customer_header #comHeaderBox .spNavBtn{position: absolute;right: 245px;top: 13px;} #customer_header #comHeaderBox .spNavBtn .modalLink{padding-top:5px;} #customer_header #comHeaderBox .spNavBtn .modalLink a{font-size:18px;letter-spacing:.1em;} #customer_header #comHeaderBox .spNavBtn .modalLink a:hover{opacity:0.75;} #customer_header #comHeaderBox .spNavBtn .modalLink a:after{content:'/';padding:0 5px;} #customer_header #comHeaderBox .spNavBtn .modalLink a:last-child:after{content:none;} #customer_header #comHeaderBox .spRsvBtn{display:block;position:absolute;top:14px;right:50px;width:195px;} #customer_header #comHeaderBox .spRsvBtn a{display:block;text-align:center;background:#ddd;border-radius:3px;color:#0F1E17;padding:5px 10px 5px 8px;font-size:14px;letter-spacing:0.5px;} #customer_header #comHeaderBox .spRsvBtn span{font-size:11px;} #customer_header #comHeaderBox .spRsvBtn i{text-align:center;margin:0 auto;display:inline-block;vertical-align:middle;line-height: 1.6;} #customer_header #comHeaderBox .dropdown__lists {max-width: 195px;} } @media screen and (max-width:1184px){ #customer_header #comHeaderBox .babyLink, #customer_header #comHeaderBox .onenessLink, #customer_header #comHeaderBox .dogLink {display:none;} } @media screen and (max-width:460px){ #customer_header #comHeaderBox .spNavBtn{display:none;} } /* グローバルメニュー ■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□ -----------------------------------------------------------------------*/ #customer_header #modalNav{opacity:0;visibility: hidden;position:fixed;top:0;left:0;background-image:url(https://www.toba-kisara.com/kisara/img/com/menu_bg.jpg);background-position:50% 50%; width:100%;height:100%;z-index:9000;-webkit-transition:all .35s ease; -moz-transition:all .35s ease; -ms-transition:all .35s ease; -o-transition:all .35s ease; transition:all .35s ease;} #customer_header #modalNav .inner{max-width:100%;} #customer_header #modalNav nav{position:fixed;top:0;left:0;width:100%;height:100vh;overflow-y: scroll;scrollbar-face-color: #999;scrollbar-track-color: #eee;-webkit-overflow-scrolling: touch;} #customer_header #modalNav nav::-webkit-scrollbar {width: 5px;} #customer_header #modalNav nav::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.3);} #customer_header #modalNav nav::-webkit-scrollbar-track {background: rgba(0, 0, 0, 0.1);} #customer_header #modalNav .modalMainNav{position:relative; overflow:hidden;padding:100px 0 0 0;text-align:center;max-width:500px;margin:40px auto 20px auto;} #customer_header #modalNav .modalMainNav li{padding-bottom:40px;font-size:17px;float:left;width:50%;} #customer_header #modalNav .modalMainNav li a{position: relative;display: inline-block;color:#ddd;} #customer_header #modalNav .modalMainNav li a::after {position: absolute;bottom: -4px;left: 0;content: '';width: 100%;height: 1px;background: #ddd;transform: scale(0, 1);transform-origin: right top;transition: transform .3s;} #customer_header #modalNav .modalMainNav li a:hover::after {transform-origin: left top;transform: scale(1, 1);} @media screen and (max-width:640px) { #customer_header #modalNav .modalMainNav li{font-size:16px;padding-bottom: 30px;} } /* サブナビ */ #customer_header #modalNav .modalSubNav{position:relative; overflow:hidden;padding:30px 0 100px 0;text-align:center;} #customer_header #modalNav .modalSubNav ul{display:table;width:150px;table-layout:fixed;margin:0 auto;} #customer_header #modalNav .modalSubNav li{display:table-cell;font-size:22px;padding:0 10px;text-align:center;vertical-align:top;} #customer_header #modalNav .modalSubNav li a{color:#777;} #customer_header #modalNav .modalTel {margin-bottom:20px;color:#aaa;} #customer_header #modalNav .modalTel a{line-height:1.5;font-size:18px;letter-spacing:2px;color:#aaa;} #customer_header #modalNav .modalTel a i{font-size:16px;} #customer_header #modalNav .modalTel span{font-size:14px;} #customer_header #modalNav .modalLink{margin-bottom:15px;} #customer_header #modalNav .modalLink a{font-size:16px;color:#aaa;} #customer_header #modalNav .modalLink.type02 a{font-size:22px;} #customer_header #modalNav .modalLink a:after{content:'/';padding:0 5px;} #customer_header #modalNav .modalLink a:last-child:after{content:none;} @media screen and (max-width:640px) { #customer_header #modalNav .modalLink a{font-size:15px;} #customer_header #modalNav .modalLink.type02 a{font-size:20px;} } /* 予約 */ #customer_header #modalNav .modalRsvNav {margin:0 auto;max-width:300px;width:90%;text-align:center;} #customer_header #modalNav .modalRsvNav div{margin-bottom:15px;} #customer_header #modalNav .modalRsvNav a{display:block;color:#fff;width:100%;line-height:1.6;font-size:18px;border-radius:3px;padding:10px 0;} #customer_header #modalNav .modalRsvNav .btn1 a{background:#ddd;color:#0F1E17;} #customer_header #modalNav .modalRsvNav .btn2 a{background:#F29C9F;} #customer_header #modalNav .modalRsvNav .btn3 a{background:#fff;color:#0F1E17;} #customer_header #modalNav .modalRsvNav .btn4 a{background:#b99361;} #customer_header #modalNav .modalRsvNav .btn5 a{background:#c1835d;} #customer_header #modalNav.navOpen {opacity:1;visibility: visible;z-index: 9999;} @media screen and (max-width:640px) { #customer_header #modalNav .modalRsvNav a{font-size:16px;} } /* @media screen and (min-width:1400px) { #modalNav .navList{width:100%;position: absolute;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);} } */ @media screen and (max-width:767px) { #customer_header #modalNav .modalMainNav{padding-top:30px;} } @media screen and (max-width640px) { #customer_header #modalNav nav{width:100%;} #customer_header #modalNav .modalMainNav{position:relative; overflow:hidden;} #customer_header #modalNav .modalMainNav li{float:left;width:50%;text-align:center;padding-bottom:40px;font-size:17px;} #customer_header #modalNav .modalMainNav {margin-bottom:10px;} #customer_header #modalNav .modalRsvNav .btn1 a, #customer_header #modalNav .modalRsvNav .btn2 a{padding:10px 0;} } /* ---------------------------------------- * 予約番ヘッダー * ---------------------------------------- */ #customer_header {z-index: 1044;} #customer_header #comHeaderBox {top: 0 !important;height:80px;} #customer_header #comHeaderBox h1 {padding-top: 11px;} #customer_header #comHeaderBox h1 img{width:98px;} #customer_header #comHeaderBox .inner{width:90%;} #customer_header #comHeaderBox .spNavBtn{display:block;position: absolute;right: 296px;top: 24px;} #customer_header #comHeaderBox .spNavBtn .modalLink{padding-top:5px;} #customer_header #comHeaderBox .spNavBtn .modalLink a{font-size:16px;letter-spacing:.1em;} #customer_header #comHeaderBox .spNavBtn .modalLink a:hover{opacity:0.75;} #customer_header #comHeaderBox .spNavBtn .modalLink a:after{content:'/';padding:0 5px;} #customer_header #comHeaderBox .spNavBtn .modalLink a:last-child:after{content:none;} #customer_header #comHeaderBox .spRsvBtn{display:block;position:absolute;top:24px;right:80px;width:195px;} #customer_header #comHeaderBox .spRsvBtn a{display:block;text-align:center;background:#ddd;border-radius:3px;color:#0F1E17;padding:5px 10px 5px 8px;font-size:14px;letter-spacing:0.5px;} #customer_header #comHeaderBox .spRsvBtn span{font-size:11px;} #customer_header #comHeaderBox .spRsvBtn i{text-align:center;margin:0 auto;display:inline-block;vertical-align:middle;line-height: 1.6;} #customer_header #comHeaderBox .dropdown__lists {max-width: 195px;} #customer_header #comHeaderBox .dropdown__lists {top: 57px;right: 80px;} #customer_header #modalNav .modalRsvNav {max-width: 600px;display: flex;flex-wrap: wrap;justify-content: space-between;} #customer_header #modalNav .modalRsvNav div {width: 49%;} /* メニューボタン */ #customer_header .menuToggleBtn {display: block;position: absolute;top: 24px;right: 0;width: 54px;height: 33px;cursor: pointer;z-index: 10000;} #customer_header .menuToggleBtn:focus {outline: none;} #customer_header .menuToggleBtn div {position: relative;text-align: center;} #customer_header .menuToggleBtn span {display: block;position: absolute;left: 0;width: 100%;height: 2px;background: #ddd;-webkit-transition: .15s ease-in-out;-moz-transition: .15s ease-in-out;transition: .15s ease-in-out;font-size:0;} #customer_header .menuToggleBtn span:nth-child(1) {top: 0;} #customer_header .menuToggleBtn span:nth-child(2) {top: 15px;} #customer_header .menuToggleBtn span:nth-child(3) {top: 30px;} /* メニューボタン OPEN */ /* 閉じるボタン */ #customer_header #modalNav .menuToggleBtn span:nth-child(1) { top: 14px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); } #customer_header #modalNav .menuToggleBtn span:nth-child(2) { top: 14px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); } /* モーダル OPEN */ #customer_header #modalNav:target { opacity: 1; visibility: visible; z-index: 9999; } @media screen and (max-width: 640px) { #customer_header #modalNav .modalRsvNav a {font-size: 14px;} #customer_header #comHeaderBox .inner {width: 94%;} #customer_header .menuToggleBtn {width: 35px;} #customer_header .menuToggleBtn span:nth-child(1) {top: 2px;} #customer_header .menuToggleBtn span:nth-child(3) {top: 28px;} #customer_header #comHeaderBox .spRsvBtn {right: 45px;width: 175px;} #customer_header #comHeaderBox .spRsvBtn a {padding: 5px 4px 5px 4px;} #customer_header #comHeaderBox .dropdown__lists {right: 45px;} #customer_header #comHeaderBox .dropdown__lists {max-width: 175px;} #customer_header #comHeaderBox .spNavBtn {right: 212px;top: 25px;} #customer_header #comHeaderBox .spNavBtn .modalLink{display:none;} #customer_header #comHeaderBox h1 {padding-top: 16px;} #customer_header #comHeaderBox h1 img {width: 80px;} } /* footer ■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□ -----------------------------------------------------------------------*/ #customer_footer #tripAi{opacity:0;} #customer_footer #footerSub{position:relative; overflow:hidden;background:url(https://www.toba-kisara.com/kisara/img/footer/footer_sub.jpg) 50% 50% no-repeat;background:cover;padding:100px 0;color:#ddd;font-size:16px;line-height:2;} #customer_footer #footerSub h4{position:absolute;width:110px;vertical-align:top;font-size:24px;color:#777;border-bottom:1px solid #777;} #customer_footer #footerSub .siteMap {margin-bottom:50px;} #customer_footer #footerSub .siteMap .box1{position:relative;overflow:hidden;width:100%;padding:50px 0 0 140px;} #customer_footer #footerSub .siteMap ul{float:left;} #customer_footer #footerSub .siteMap ul{width:25%;} #customer_footer #footerSub .siteMap li{margin:5px 0;} #customer_footer #footerSub .siteMap li a{color:#ddd;font-size:14px;} #customer_footer #footerSub .siteMap li.i1 a:before{content:"\f105";font-family: FontAwesome;line-height:0;color:#aaa;padding-right:5px;} #customer_footer #footerSub .siteMap li.i2 a:before{content:"\f068";font-family: FontAwesome;line-height:3px;font-size:8px;color:#aaa;padding-right:5px;} #customer_footer #footerSub .siteMap li.i2{padding-left:1em;} #customer_footer #footerSub .group .box1{position:relative;display:table;width:100%;padding:70px 0 0 150px;} #customer_footer #footerSub .group img{width:150px;opacity:0.7;} #customer_footer #footerMain{position:relative; overflow:hidden;background:url(https://www.toba-kisara.com/kisara/img/footer/footer.gif) 50% 50% repeat;padding:30px 0;color:#ddd;font-size:14px;} #customer_footer #footerMain .left{float:left;position:relative; overflow:hidden;line-height:1.6;padding-top:18px;} #customer_footer #footerMain .left .logo{width:55px;float:left;} #customer_footer #footerMain .left .add{width:400px;float:left;margin:0 15px;} #customer_footer #footerMain .bnrLink{float:left;} #customer_footer #footerMain .right{float:right;text-align:right;line-height:2;} #customer_footer #footerMain .right .snsLink {display:table;width:100px;margin:0 0 5px auto;} #customer_footer #footerMain .right .snsLink li{display:table-cell;text-align:right;} #customer_footer #footerMain .right .snsLink li a{color:#ddd;font-size:16px;} #customer_footer #footerMain .right .snsLink li i{font-size:16px;} #customer_footer #footerMain .right .link1 {display:table;width:335px;margin-bottom:10px;} #customer_footer #footerMain .right .link1 a{display:table-cell;color:#ddd;} #customer_footer #footerMain .right .link1 a:after{content:"|";color:#aaa;padding:0 5px;} #customer_footer #footerMain .right .link1 a:last-child:after{content:none;} #customer_footer #footerMain .copy{font-size:10px;} @media screen and (max-width:1200px) { #customer_footer #footerMain .left, #customer_footer #footerMain .right{float:none;text-align:left;} #customer_footer #footerMain .right .snsLink {margin:10px 0;} #customer_footer #footerSub .siteMap .box1, #customer_footer #footerSub .group .box1{padding:70px 0 0 0px;} } @media screen and (max-width:991px) and (min-width:641px){ #customer_footer #footerSub .siteMap ul{width:50%;margin-bottom:50px;} #customer_footer #footerSub .siteMap ul:nth-last-child(-n+2){margin:0;} } @media screen and (max-width:767px){ #customer_footer #footerSub{background:url(https://www.toba-kisara.com/kisara/img/footer/footer_sub_sp_20230210.jpg) 50% 100% no-repeat;} #customer_footer #footerMain {padding:40px 0 80px 0;} #customer_footer #footerMain .bnrLink, #customer_footer #footerMain .left .logo, #customer_footer #footerMain .left .add{float:none;width:100%;text-align:center;} #customer_footer #footerMain .left .logo{width:60px;margin:0 auto;} #customer_footer #footerMain .left{line-height:2;} #customer_footer #footerMain .left .add{margin:20px auto;} #customer_footer #footerMain .right .link1 {margin:20px auto 40px auto;} #customer_footer #footerMain .right .snsLink {margin:15px auto 0 auto;width:130px;} #customer_footer #footerMain .right .snsLink li{text-align:center;} #customer_footer #footerMain .right .snsLink li a{font-size:20px;} #customer_footer #footerMain .copy{text-align:center;} } @media screen and (max-width:640px){ #customer_footer #footerSub .siteMap ul{width:50%;margin-bottom:50px;} #customer_footer #footerSub .siteMap ul:last-child{margin:0;} } @media screen and (max-width:480px){ #customer_footer #footerSub .siteMap {margin-bottom:10px;} #customer_footer #footerSub {padding:50px 0;} } @media screen and (max-width:360px){ #customer_footer #footerSub .siteMap ul{width:100%;margin-bottom:0;} } /* 汎用 ■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□ -----------------------------------------------------------------------*/ #customer_footer .inner, #customer_header .inner{position:relative;max-width:1200px;width:90%;margin:0 auto!important;} #customer_footer .ffNs, #customer_header .ffNs {font-family:'Noto Serif JP', sans-serif,Palatino Linotype,Book Antiqua,Palatino,Klee,"游明朝体",Yu Mincho,YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","HG明朝B","メイリオ","ＭＳ Ｐ明朝","MS PMincho","meiryo",serif;} #customer_footer .ffEn, #customer_header .ffEn {font-family:'Times New Roman','Luchida Grande';} #customer_footer .alignC, #customer_header .alignC { text-align: center!important;} #customer_header a:focus, #customer_footer a:focus{outline:none;}