@charset "utf-8"; /* --------------------------------------------------------------------------------------------------- 　FONT --------------------------------------------------------------------------------------------------- */ @font-face{font-family:themify;src:url(../font/themify/themify.eot?-fvbane);src:url(../font/themify/themify.eot?#iefix-fvbane) format('embedded-opentype'),url(../font/themify/themify.woff?-fvbane) format('woff'),url(../font/themify/themify.ttf?-fvbane) format('truetype'),url(../font/themify/themify.svg?-fvbane#themify) format('svg');font-weight:400;font-style:normal}[class*=" ti-"],[class^=ti-]{font-family:themify;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ti-arrow-right:before {content: "\e628"}.ti-star:before{content:"\e60a"}.ti-search:before{content:"\e610"}.ti-zoom-in:before{content:"\e611"}.ti-zoom-out:before{content:"\e612"}.ti-mobile:before{content:"\e621"}.ti-minus:before{content:"\e622"}.ti-link:before{content:"\e62d"}.ti-layers:before{content:"\e62f"}.ti-layers-alt:before{content:"\e630"}.ti-heart:before{content:"\e634"}.ti-flag:before{content:"\e63a"}.ti-flag-alt:before{content:"\e63b"}.ti-flag-alt-2:before{content:"\e63c"}.ti-close:before{content:"\e646"}.ti-clip:before{content:"\e647"}.ti-angle-up:before{content:"\e648"}.ti-angle-right:before{content:"\e649"}.ti-angle-left:before{content:"\e64a"}.ti-angle-down:before{content:"\e64b"}.ti-check:before{content:"\e64c"}.ti-check-box:before{content:"\e64d"}.ti-bolt:before{content:"\e652"}.ti-bolt-alt:before{content:"\e653"}.ti-arrows-vertical:before{content:"\e657"}.ti-arrows-horizontal:before{content:"\e658"}.ti-fullscreen:before{content:"\e659"}.ti-arrow-top-right:before{content:"\e65a"}.ti-arrow-top-left:before{content:"\e65b"}.ti-arrow-circle-up:before{content:"\e65c"}.ti-arrow-circle-right:before{content:"\e65d"}.ti-arrow-circle-left:before{content:"\e65e"}.ti-arrow-circle-down:before{content:"\e65f"}.ti-angle-double-up:before{content:"\e660"}.ti-angle-double-right:before{content:"\e661"}.ti-angle-double-left:before{content:"\e662"}.ti-angle-double-down:before{content:"\e663"}.ti-thumb-up:before{content:"\e670"}.ti-quote-right:before{content:"\e67e"}.ti-quote-left:before{content:"\e67f"}.ti-control-play:before{content:"\e6ad"}.ti-control-forward:before{content:"\e6af"}.ti-book:before{content:"\e6b7"}.ti-back-right:before{content:"\e6bc"}.ti-back-left:before{content:"\e6bd"}.ti-arrows-corner:before{content:"\e6be"}.ti-archive:before{content:"\e6bf"}.ti-anchor:before{content:"\e6c0"}.ti-align-right:before{content:"\e6c1"}.ti-align-left:before{content:"\e6c2"}.ti-align-justify:before{content:"\e6c3"}.ti-align-center:before{content:"\e6c4"}.ti-alert:before{content:"\e6c5"}.ti-alarm-clock:before{content:"\e6c6"}.ti-agenda:before{content:"\e6c7"}.ti-write:before{content:"\e6c8"}.ti-window:before{content:"\e6c9"}.ti-wallet:before{content:"\e6cd"}.ti-video-clapper:before{content:"\e6ce"}.ti-video-camera:before{content:"\e6cf"}.ti-shift-right-alt:before{content:"\e6d9"}.ti-shift-left-alt:before{content:"\e6da"}.ti-ruler-alt-2:before{content:"\e6db"}.ti-receipt:before{content:"\e6dc"}.ti-pin2:before{content:"\e6dd"}.ti-pin-alt:before{content:"\e6de"}.ti-palette:before{content:"\e6e0"}.ti-more:before{content:"\e6e1"}.ti-more-alt:before{content:"\e6e2"}.ti-hand-point-up:before{content:"\e71a"}.ti-hand-point-right:before{content:"\e71b"}.ti-hand-point-left:before{content:"\e71c"}.ti-hand-point-down:before{content:"\e71d"}.ti-gallery:before{content:"\e71e"}.ti-face-smile:before{content:"\e71f"}.ti-youtube:before{content:"\e728"}.ti-twitter:before{content:"\e72a"}.ti-time:before{content:"\e72b"}.ti-share:before{content:"\e72e"}.ti-share-alt:before{content:"\e72f"}.ti-pinterest:before{content:"\e731"}.ti-new-window:before{content:"\e732"}.ti-instagram:before{content:"\e73d"}.ti-facebook:before{content:"\e741"}.ti-twitter-alt:before{content:"\e74b"}.ti-sharethis:before{content:"\e750"}.ti-sharethis-alt:before{content:"\e751"}.ti-email:before{content:"\e75a"}.ti-location-pin:before{content:"\e693"} @font-face{font-family:'FontAwesome';src:url('../font/FontAwesome4/fontawesome-webfont.eot?v=4.7.0');src:url('../font/FontAwesome4/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('../font/FontAwesome4/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../font/FontAwesome4/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('../font/FontAwesome4/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('../font/FontAwesome4/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center} .fa-instagram:before{content:"\f16d"}.fa-facebook-official:before{content:"\f230"}.fa-facebook-square:before{content:"\f082"}.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}.fa-phone:before {content:"\f095";} /* --------------------------------------------------------------------------------------------------- 　normalize.css --------------------------------------------------------------------------------------------------- */ img,legend{border:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body,figure{margin:0}a:focus{outline:dotted thin}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C""\201D""\2018""\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} /* --------------------------------------------------------------------------------------------------- 　BASE --------------------------------------------------------------------------------------------------- */ * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; /* remember: box-sizing is not supported by IE7 :( */ outline: none; vertical-align: top; } html { width: 100%; } html, body {font: normal 1em/2em 'Inter',"YakuHanJPs",'Noto Sans JP',-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,"Hiragino Sans","ヒラギノ角ゴ ProN W3","Noto Sans CJK JP", "Original Yu Gothic", "Yu Gothic", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji"; font-weight:400; margin: 0; padding: 0; width: 100%; color: #202020; background: #edebe9; /* background: url("../images/common/noise.png") repeat #edebe9; background-size: 50px; background: #e6e4e2;*/ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;vertical-align: top; } blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0;font-weight:400} p { margin: 0; padding: 0; font-weight: normal; } a { color: inherit; outline: none; text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } a:focus { outline: none; } button { text-decoration:none; border:none;} /* ----- *::selection ----- */ *::-moz-selection {background: #202020;color:#fefefe;} *::selection { background: #202020; color: #fefefe; } /* ----- h1,h2,h3,h4,h5 ----- */ h1,h2,h3,h4,h5{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; margin: 0; padding: 0;} /* ----- .cf ----- */ .cf:before, .cf:after { content: ""; display: block; overflow: hidden; } .cf:after { clear: both; } /* For IE 6/7 (trigger hasLayout) */ .cf { zoom: 1; } /* ----- .transition03 ----- */ .transition03 { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .transition05 { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } /* ----- img----- */ img { width: 100%; height:auto;} /* ----- a ----- */ a { color: inherit; outline: none; text-decoration: none; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-tap-highlight-color: rgba(0,0,0,0); } a:focus, *:focus { outline: none; text-decoration: none; } a:hover { text-decoration: none; outline: none; } /* ----- p ----- */ p { margin: 0; padding: 0; font-size: 16px; font-weight: 400; line-height: 2; letter-spacing: 0.075em; } @media only screen and (max-width: 738px) { p {line-height: 1.9; letter-spacing: 0.035em;} } @media only screen and (max-width: 560px) { p {line-height: 1.85;} } /* ----- p ----- */ p a { border-bottom: #202020 1px solid} @media only screen and (min-width: 961px) { p a:hover { opacity: .7;} } /* --------------------------------------------------------------------------------------------------- 　#page --------------------------------------------------------------------------------------------------- */ #page { height:100%; position:relative; z-index:0; overflow: hidden; } /* .load */ .load { position: fixed; bottom: 0; top: 0; right: 0; left: 0; z-index: 1001;pointer-events: none;} .anim_load {transition: all .7s .2s ease-in; background: #edebe9; } .anim_load.started {transform: none;transform: translate(0, 0);opacity: 0; background: none} .anim_load.delighter.started { opacity: 0; background: none} /* --------------------------------------------------------------------------------------------------- main --------------------------------------------------------------------------------------------------- */ main {position: relative; z-index: 0;} /* --------------------------------------------------------------------------------------------------- 　#header --------------------------------------------------------------------------------------------------- */ #header, #header:after, #header .logo_area, #header .nav_area{ -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #header .logo_area h1 a{ -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } #header { position: fixed; top: 0; left:0; right: 0; height: 70px; z-index: 99; -moz-box-sizing: border-box; box-sizing: border-box;} #header.fixed {top: 0;} #header:after { position: absolute; top:0; right: 0; left: 0; bottom: 0; content: ""; background-color: transparent;background: #edebe9; z-index: -1;} #header.fixed:after { box-shadow: 0px 0px 30px rgba(0, 0, 0, .1);-webkit-box-shadow: 0px 0px 30px rgba(0, 0, 0, .1);} @media only screen and (max-width: 960px) { #header { height: 60px; } } @media only screen and (max-width: 560px) { #header { height: 50px;} } /* -------------------------------------------- 　.logo_area -------------------------------------------- */ #header .logo_area { position: absolute; top:0; left:2.5%;width: 100px; height: 70px; margin: 0 auto; z-index: 5;} #header .logo_area h1{ width: 100px; height: 32px; display: block; position: absolute; top: 50%; left: 0; font-size: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index:0;} #header .logo_area h1 a {display: block;width: 100px; height: 32px; position: relative; z-index: 0;} #header .logo_area h1 a:before, #header .logo_area h1 a:after {-webkit-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out;} #header .logo_area h1 a:before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ""; background: url("../images/common/logo_header.svg") center left no-repeat; background-size: contain; z-index: 0;} @media only screen and (max-width: 960px) { #header .logo_area { left:2.5%;width: 80px; height: 60px; } #header .logo_area h1{ width: 80px; height: 25px; } #header .logo_area h1 a {width: 80px; height: 25px; } } @media only screen and (max-width: 738px) { #header .logo_area {width: 70px; height: 50px; } #header .logo_area h1{ width: 70px; height: 22px; } #header .logo_area h1 a {width: 70px; height: 22px; } } /* -------------------------------------------- 　.nav_area -------------------------------------------- */ #header .nav_area { position: absolute; top: 0; left: 2.5%; right: 2.5%; margin: 0; z-index: 0;} /* ul.nav_list */ ul.nav_list { ist-style: none; font-size: 0; text-align: center;position: relative; z-index: 0;} ul.nav_list li {display:inline-block; margin: 0 1.5vw; position: relative; z-index: 0;} ul.nav_list li a { display: block; font-size: 15px;font-family: 'inter' ;font-weight: 400;font-feature-settings : "palt" 1; letter-spacing: 0.025em; line-height: 70px; position: relative; z-index: 0;text-decoration: underline;text-decoration-color: transparent;text-decoration-thickness:1px;text-transform: uppercase; } @media only screen and (max-width:1200px) { ul.nav_list { margin-left: 11.5vw; text-align: left;} } @media only screen and (min-width:961px) { ul.nav_list li a:hover { opacity: .6} } @media only screen and (max-width: 960px) { #header .nav_area {display: none;} } /* -------------------------------------------- 　.nav_sns_area -------------------------------------------- */ #header .nav_sns_area { position: absolute; top: 0; right: 190px; z-index: 0;} #header .nav_sns_area ul.list_sns { margin: 14px 0 0; list-style: none; font-size: 0;} #header .nav_sns_area ul.list_sns li { margin: 0 0 0 8px; font-size: 14px; display: inline-block; line-height: 0;} #header .nav_sns_area ul.list_sns li a {display: block; width: 40px; height: 40px; background: #fefefe; font-size: 0; font-family: 'Inter'; font-weight: 500; line-height: 40px; letter-spacing:0; position: relative; z-index: 0;border-radius:3px;border-radius:100%;} #header .nav_sns_area ul.list_sns li a:before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto 0; font-size: 20px; text-align: center; font-weight: normal; z-index: 0;} #header .nav_sns_area ul.list_sns li a.instagram:before {font-family:'FontAwesome';content:"\f16d";} #header .nav_sns_area ul.list_sns li a.twitter:before {font-family:themify;content:"\e74b";} #header .nav_sns_area ul.list_sns li a.x:before {content: ""; width: 16px; height: 16px; margin: auto; background: url("../images/common/logo-x.png") center center no-repeat; background-size: contain;} @media only screen and (min-width:961px) { #header .nav_sns_area ul.list_sns li a:hover { background: rgba(254,254,254,.5);} } @media only screen and (max-width: 960px) { #header .nav_sns_area { right: 170px; right: 2.5%; margin-right: 150px;} #header .nav_sns_area ul.list_sns { margin: 10px 0 0; } #header .nav_sns_area ul.list_sns li a:before { font-size:18px; } } @media only screen and (max-width: 560px) { #header .nav_sns_area { margin-right: 140px;} #header .nav_sns_area ul.list_sns { margin: 6px 0 0; } #header .nav_sns_area ul.list_sns li { margin: 0 0 0 6px;} #header .nav_sns_area ul.list_sns li a { line-height: 36px;height: 36px; width: 36px;} #header .nav_sns_area ul.list_sns li a:before {font-size:17px; } #header .nav_sns_area ul.list_sns li a.x:before {width: 14px; height: 14px;} } @media only screen and (max-width: 320px) { #header .nav_sns_area { margin-right: 120px;} } /* -------------------------------------------- 　.nav_webstore_area -------------------------------------------- */ #header .nav_webstore_area {position: absolute; top: 11px; top: 10px; right: 20px; z-index: 1;-webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} #header .nav_webstore_area a.btn_webstore { display: block; padding: 0 0 0 20px; width: 160px; height: 45px; height: 50px; line-height: 50px;position: relative; z-index: 0; background: #f1e90b;border-radius:3px;-webkit-border-radius:3px;} /*#header .nav_webstore_area a.btn_webstore:after { position: absolute; top: 0; right: 7px; bottom: 0;font-family:themify; content: "\e649"; }*/ #header .nav_webstore_area a.btn_webstore:after { position: absolute; top: 0; right: 15px; bottom: 0; width: 20px; content: ""; background: url("../images/common/arrow_right.png") center right no-repeat; background-size: contain;} #header .nav_webstore_area a.btn_webstore .inner { position: absolute;top: 49%; left: 25px; line-height: 1; -webkit-transform: translate(0,-50%); transform: translate(0,-50%); z-index: 0;} #header .nav_webstore_area a.btn_webstore .t_en {display: block;font-size: 11px; font-family: 'inter' ;font-weight: 500; letter-spacing: .025em;line-height: 1; text-indent: 1px;} #header .nav_webstore_area a.btn_webstore .t_jp {display: block; margin: 3px 0 0;font-size: 14px; font-family: 'Noto Sans JP', sans-serif;font-weight: 500; letter-spacing: .15em; line-height: 1; font-feature-settings : "palt" 1;} @media only screen and (min-width:961px) { #header .nav_webstore_area a.btn_webstore:hover { background: rgba(241,233,11,.5);} } @media only screen and (max-width: 960px) { #header .nav_webstore_area {top: 10px; top: 5px; right: 2.5%; } #header .nav_webstore_area a.btn_webstore { padding: 0 0 0 15px; width: 140px; height: 40px; height: 50px; font-size: 14px;letter-spacing: .1em; line-height: 40px;} #header .nav_webstore_area a.btn_webstore:after { right: 12px;width: 15px; } #header .nav_webstore_area a.btn_webstore .inner {left: 16px;} #header .nav_webstore_area a.btn_webstore .t_en { font-size: 11px; } #header .nav_webstore_area a.btn_webstore .t_jp { margin: 3px 0 0;font-size: 14px; } } @media only screen and (max-width:560px) { #header .nav_webstore_area {top: 5px; top: 3px; right: 2.5%; } #header .nav_webstore_area a.btn_webstore { padding: 0 0 0 15px; width: 130px; height: 38px; line-height: 38px; height: 44px; line-height: 44px;} #header .nav_webstore_area a.btn_webstore:after { right: 13px;width: 12px; } #header .nav_webstore_area a.btn_webstore .inner {left: 15px;} #header .nav_webstore_area a.btn_webstore .t_en { font-size: 11px; } #header .nav_webstore_area a.btn_webstore .t_jp { margin: 1px 0 0;font-size: 13px; } } @media only screen and (max-width:320px) { #header .nav_webstore_area a.btn_webstore { padding: 0; width: 110px;/*text-align: center;*/} #header .nav_webstore_area a.btn_webstore:after { display: none; } #header .nav_webstore_area a.btn_webstore .inner { position: absolute;top: 49%; left: 50%;-webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); white-space: nowrap;} #header .nav_webstore_area a.btn_webstore .t_jp { margin: 1px 0 0;} } /* -------------------------------------------- 　.btnClose -------------------------------------------- */ #ticket_menu .btnClose, #nav_menu .btnClose { position: absolute; top:10px; right:20px; width:50px;height:50px; line-height: 50px; display: block; background:#fefefe; z-index:1001; font-size: 0;text-align: center;border-radius:100%; } #ticket_menu .btnClose:after, #nav_menu .btnClose:after{position:absolute;top:0;right:0;left:0;bottom:0;font-family:themify;content:"\e646";font-size:18px;text-indent:0;z-index:1;margin: auto;} @media only screen and (min-width:961px) { #ticket_menu .btnClose:hover, #nav_menu .btnClose:hover{ background: rgba(254,254,254,.5);} } @media only screen and (max-width:960px) { #ticket_menu .btnClose, #nav_menu .btnClose{ right:15px;top:10px;width:45px;height:45px; line-height: 45px;} #ticket_menu .btnClose:after, #nav_menu .btnClose:after{font-size:16px;} } @media only screen and (max-width:738px) { #ticket_menu .btnClose, #nav_menu .btnClose{ right:10px;top:7px;width:45px;height:45px; line-height:45px;} #ticket_menu .btnClose:after, #nav_menu .btnClose:after{font-size:15px;} } @media only screen and (max-width:560px) { #ticket_menu .btnClose, #nav_menu .btnClose{ right:10px;top:7px;} #ticket_menu .btnClose:after, #nav_menu .btnClose:after{font-size:14px;} } /* ----------------------------------------------------------- jQuery.mmenu CSS ----------------------------------------------------------- */ #ticket_menu:not( .mm-menu ) { display: none; } /* jQuery.mmenu oncanvas CSS */ .mm-hidden { display: none !important; } .mm-wrapper { overflow-x: hidden; position: relative; } .mm-menu, .mm-panels, .mm-panels > .mm-panel { margin: 0; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: -1; } .mm-panels > .mm-panel { margin-top: 0px;} .mm-menu { box-sizing: border-box; background: inherit; display: block; overflow: hidden; padding: 0; } .mm-panel { -webkit-transition: -webkit-transform 0.425s ease 0.1s; -moz-transition: -moz-transform 0.425s ease 0.1s; -ms-transition: -ms-transform 0.425s ease 0.1s; -o-transition: -o-transform 0.425s ease 0.1s; transition: transform 0.425s ease 0.1s; -webkit-transform: translate3d(100%, 0, 0); -moz-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); -o-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .mm-panel.mm-opened { -webkit-transform: translate3d(0%, 0, 0); -moz-transform: translate3d(0%, 0, 0); -ms-transform: translate3d(0%, 0, 0); -o-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); } .mm-panel.mm-subopened { -webkit-transform: translate3d(-30%, 0, 0); -moz-transform: translate3d(-30%, 0, 0); -ms-transform: translate3d(-30%, 0, 0); -o-transform: translate3d(-30%, 0, 0); transform: translate3d(-30%, 0, 0); } .mm-panel.mm-highest { z-index: 1; } .mm-panels, .mm-panels > .mm-panel { background: inherit; border-color: inherit; } .mm-panels > .mm-panel { background: inherit; border-color: inherit; -webkit-overflow-scrolling: touch; overflow: scroll; overflow-x: hidden; overflow-y: auto; box-sizing: border-box; padding: 0 30px; } .mm-panels > .mm-panel.mm-hasnavbar { padding-top: 40px; } .mm-panels > .mm-panel:before, .mm-panels > .mm-panel:after { content: ''; display: block; height: 70px; } @media only screen and (max-width: 960px) { .mm-panels > .mm-panel:before, .mm-panels > .mm-panel:after { content: ''; display: block; height: 65px; } } @media only screen and (max-width: 738px) { .mm-panels > .mm-panel:before, .mm-panels > .mm-panel:after { height: 60px; } } .mm-vertical .mm-panel { -webkit-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; -o-transform: none !important; transform: none !important; } .mm-vertical .mm-listview .mm-panel .mm-listview > li:last-child:after, .mm-listview .mm-vertical .mm-panel .mm-listview > li:last-child:after { border-color: transparent; } .mm-vertical li.mm-opened > .mm-panel, li.mm-vertical.mm-opened > .mm-panel { display: block; } /* jQuery.mmenu offcanvas addon CSS */ .mm-page { box-sizing: border-box; position: relative; } .mm-slideout { -webkit-transition: -webkit-transform 0.4s ease; -ms-transition: -ms-transform 0.4s ease; transition: transform 0.4s ease; } html.mm-opened { overflow-x: hidden; position: relative; } html.mm-blocking { overflow: hidden; } html.mm-blocking body { overflow: hidden; } html.mm-background .mm-page { background: inherit; } #mm-blocker { background: rgba(3, 2, 1, 0); display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 999999; } html.mm-blocking #mm-blocker { display: block; } .mm-menu.mm-offcanvas { display: none; position: fixed; } .mm-menu.mm-current { display: block; } .mm-menu { width: 80%; min-width: 140px; max-width: 440px;max-width: 380px; } html.mm-opening .mm-slideout { -webkit-transform: translate(80%, 0); -moz-transform: translate(80%, 0); -ms-transform: translate(80%, 0); -o-transform: translate(80%, 0); transform: translate(80%, 0); } @media all and (max-width: 175px) { html.mm-opening .mm-slideout { -webkit-transform: translate(140px, 0); -moz-transform: translate(140px, 0); -ms-transform: translate(140px, 0); -o-transform: translate(140px, 0); transform: translate(140px, 0); } } @media all and (min-width: 550px) { html.mm-opening .mm-slideout { -webkit-transform: translate(380px, 0); -moz-transform: translate(380px, 0); -ms-transform: translate(380px, 0); -o-transform: translate(380px, 0); transform: translate(380px, 0); } } /* jQuery.mmenu dragOpen addon CSS */ html.mm-opened.mm-dragging .mm-menu, html.mm-opened.mm-dragging .mm-slideout { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /* jQuery.mmenu pagedim extension CSS */ html.mm-pagedim #mm-blocker, html.mm-pagedim-white #mm-blocker, html.mm-pagedim-black #mm-blocker { opacity: 0; } html.mm-pagedim.mm-opening #mm-blocker, html.mm-pagedim-white.mm-opening #mm-blocker, html.mm-pagedim-black.mm-opening #mm-blocker { opacity: 0.8; /*transition: opacity 0.2s ease 0.1s;*/-webkit-transition: opacity 0.4s ease 0.1s; transition: opacity 0.4s ease 0.1s;} html.mm-pagedim #mm-blocker { background: inherit; } html.mm-pagedim-white #mm-blocker { background: #fff; } html.mm-pagedim-black #mm-blocker { background: #322d28; background: #a29c95; background: #333331} /* jQuery.mmenu position extension CSS */ .mm-menu.mm-top, .mm-menu.mm-bottom { width: 100%; min-width: 100%; max-width: 100%; } .mm-menu.mm-right { left: auto; right: 0; } .mm-menu.mm-bottom { top: auto; bottom: 0; } html.mm-right.mm-opening .mm-slideout { -webkit-transform: translate(-80%, 0); -moz-transform: translate(-80%, 0); -ms-transform: translate(-80%, 0); -o-transform: translate(-80%, 0); transform: translate(-80%, 0); } @media all and (max-width: 175px) { html.mm-right.mm-opening .mm-slideout { -webkit-transform: translate(-140px, 0); -moz-transform: translate(-140px, 0); -ms-transform: translate(-140px, 0); -o-transform: translate(-140px, 0); transform: translate(-140px, 0); } } @media all and (min-width: 550px) { html.mm-right.mm-opening .mm-slideout { -webkit-transform: translate(-380px, 0); -moz-transform: translate(-380px, 0); -ms-transform: translate(-380px, 0); -o-transform: translate(-380px, 0); transform: translate(-380px, 0); } } /* jQuery.mmenu z-position extension CSS */ html.mm-front .mm-slideout { -webkit-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; -o-transform: none !important; transform: none !important; z-index: 0 !important; } .mm-menu.mm-front { z-index: 1; } .mm-menu.mm-front, .mm-menu.mm-next { -webkit-transition: -webkit-transform 0.425s ease; -ms-transition: -ms-transform 0.425s ease; transition: transform 0.425s ease; -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); -o-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .mm-menu.mm-front.mm-right, .mm-menu.mm-next.mm-right { -webkit-transform: translate3d(100%, 0, 0); -moz-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); -o-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } html.mm-opening .mm-menu.mm-front, html.mm-opening .mm-menu.mm-next { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* jQuery.mmenu z-position extension CSS */ .mm-panels { background: #edebe9;} .nav_main_area { position: relative; z-index: 0; padding: 70px 0 0; } /* .logo_area */ .nav_main_area .logo_area { position: absolute; top:0; left:30px;width: 120px; height: 70px; margin: 0 auto; z-index: 5;} .nav_main_area .logo_area span{ width: 120px; height: 50px; display: block; position: absolute; top: 50%; left: 0; font-size: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index:0;} .nav_main_area .logo_area span:before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ""; background: url("../images/beach/logo_header_beach_blue.svg") center left no-repeat; background-size: contain; z-index: 0;} @media only screen and (max-width: 960px) { .nav_main_area .logo_area { left:25px; height: 65px; } } @media only screen and (max-width: 738px) { .nav_main_area .logo_area {left:20px; height: 55px; } .nav_main_area .logo_area span{ width: 110px; height: 30px;} } .t_ttl_buyticket { position: absolute; top:0; left:30px;width: 120px; height: 70px; margin: 0 auto; z-index: 5; font-size: 15px; font-family: 'Inter'; font-weight: 500; line-height: 70px; letter-spacing: .025em; text-transform: uppercase;} @media only screen and (max-width: 960px) { .t_ttl_buyticket { left:25px;height: 65px; font-size: 15px; line-height: 65px;} } @media only screen and (max-width: 738px) { .t_ttl_buyticket { left:20px;height: 65px; line-height: 65px;} } /* ul.nav_list_sp */ ul.nav_list_sp { list-style: none; margin: 20px 0 0;} ul.nav_list_sp li { display: block; margin: 8px 0 0; } ul.nav_list_sp li a { display: block; padding: 0 20px; background: #fefefe; font-size: 17px;font-weight: 400;letter-spacing: 0.01em; line-height: 55px; text-align: left; position: relative; z-index: 0;border-radius:3px;-webkit-border-radius:3px;} ul.nav_list_sp li a:after { position: absolute; top: 0; right: 20px; bottom: 0; font-size: 0.9em; font-family: 'themify';content: "\e649";} ul.nav_list_sp li a .t_small { margin: 0 0 0 5px; font-size: .85em; vertical-align: 0;} ul.nav_list_sp li a .t_date { margin: 0 0 0 5px; font-size: .75em; font-weight: 300;vertical-align: 0;} /* soldout */ ul.nav_list_sp li .soldout { display: block; padding: 0 20px; background: #EDEBE9; color: #f0f0f0; font-size: 17px;font-weight: 400;letter-spacing: 0.01em; line-height: 1.2; height: 55px; text-align: left; position: relative; z-index: 0;border-radius:3px;-webkit-border-radius:3px;} ul.nav_list_sp li .soldout .inner { position: absolute; top: 50%; left: 20px; right: 20px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 0;} ul.nav_list_sp li .soldout .t_soldout {display: block;color: #e0e0e0; font-size: 13px; font-weight: 500;} ul.nav_list_sp li .soldout .t_small { margin: 0 0 0 5px; font-size: .85em; vertical-align: 0;} ul.nav_list_sp li .soldout .t_date { margin: 0 0 0 5px; font-size: .75em; font-weight: 300;vertical-align: 0;} @media only screen and (min-width:961px) { ul.nav_list_sp li a:hover { background: #4a4a48;} } @media only screen and (max-width: 960px) { .mm-panels > .mm-panel { padding: 0 25px; } } @media screen and (max-width: 738px) { .mm-panels > .mm-panel { padding: 0 20px; } ul.nav_list_sp li a { padding: 0 15px;font-size: 16px;line-height: 55px;} ul.nav_list_sp li a:after { right: 15px;} ul.nav_list_sp li .soldout { padding: 0 15px;font-size: 16px;height: 55px;line-height: 1.1; } ul.nav_list_sp li .soldout .inner {left: 15px;} } @media screen and (max-width: 560px) { ul.nav_list_sp li a { line-height: 50px;} ul.nav_list_sp li .soldout { height: 50px;font-size: 14px; } } @media screen and (max-width: 375px) { ul.nav_list_sp li a { font-size: 15px;} ul.nav_list_sp li a:after { right: 10px;} ul.nav_list_sp li a .t_date { margin: 0 0 0 3px; font-size: .725em;} ul.nav_list_sp li .soldout { font-size: 14px; } } /* --- . ticket_area--- */ #ticket_menu .ticket_area { font-size: 0; margin: 0;padding: 25px 0; border-top: #aaa 1px solid;} #ticket_menu .ticket_area+.ticket_area {} #ticket_menu .ticket_item {display: block; margin: 0; margin: 12px 0 0;position: relative; z-index: 0; line-height: 0;} #ticket_menu .ticket_item+.ticket_item {margin: 25px 0 0;} #ticket_menu .ticket_item:last-child {/*border-bottom: #cfcfdd 1px solid;*/} #ticket_menu .ticket_area .t_ttl_event { font-size: 14px;line-height: 1.4;letter-spacing: 0.015em;} #ticket_menu .ticket_area .t_ttl_event span { margin: 0 0 1px; display: block; font-weight: 500;} #ticket_menu .ticket_area .t_ttl_event .t_sizeL { display: block; margin-top: 0px; font-size: 18px; font-weight: 400; line-height: 1.2} #ticket_menu .ticket_item .ttl_area {font-size: 0;margin: 20px 0 0;} #ticket_menu .ticket_item .t_ttl_ticket { display: inline-block; padding: 0 7px; margin: 0; background:#202020;color: #f0f0f0; font-size: 16px; line-height: 1.8; vertical-align: middle;letter-spacing: .035em; } #ticket_menu .ticket_item .t_ttl_ticket .t_en { font-size: .75em; vertical-align: 0; margin-left: 3px;} #ticket_menu .ticket_item .t_ttl_ticket_bus {font-size: 15px;letter-spacing: .02em;} #ticket_menu .ticket_item .t_ttl_ticket .t_small { font-size: .75em; vertical-align: 0; margin-right: 2px;} #ticket_menu .ticket_item .t_price { margin: 0 0 0 10px; display: inline-block; font-size: 20px; font-family: "YakuHanJPs",'Inter',sans-serif; font-weight: 500; line-height: 1.6; vertical-align: middle; letter-spacing: 0; } #ticket_menu .ticket_item .t_soldout { margin: 0 0 0 5px; color: #f17b4d; letter-spacing: .025em; } /*.ticket_item_now */ #ticket_menu .ticket_item_now .t_ttl_ticket {background:#202020; color: #fefefe; } #ticket_menu .ticket_area .t_ticket { margin: 0 0 5px; color: #555; font-size: 13px;letter-spacing: .025em; line-height: 1.5;} /*.ttl_area_soldout */ #ticket_menu .ticket_item_soldout .t_ttl_ticket {background:#999;color: #fafafa; } #ticket_menu .ticket_item_soldout .t_price { color: #999;} #ticket_menu .ticket_item_soldout .t_detail_ticket { color: #999;} #ticket_menu .banner_area { margin-bottom: 7px; } #ticket_menu .banner_area img {border-radius:3px;} /* dl.list_period */ #ticket_menu dl.list_period { margin: 5px 0 0; display: block; font-size: 12px; letter-spacing: .05em; line-height: 1.6; position: relative; z-index: 0;} #ticket_menu dl.list_period dt { position: absolute; top: 0; left: 1px;} #ticket_menu dl.list_period dd { padding: 0 0 0 65px;} #ticket_menu dl.list_period dd.dd_nomal {padding: 0;} /* t_detail_ticket */ #ticket_menu .t_detail_ticket { margin: 7px 0 0; display: block; font-size: 12px; letter-spacing: .05em; line-height: 1.6; position: relative; z-index: 0;} #ticket_menu .t_detail_ticket+.t_detail_ticket {margin: 0;} /* .store_area */ #ticket_menu .store_area { margin: 10px 0 0;} #ticket_menu ul.list_store { margin: 0;} #ticket_menu ul.list_store li { display: block; } #ticket_menu ul.list_store li+li {margin: 7px 0 0;} #ticket_menu ul.list_store li a, #ticket_menu ul.list_store li span { display: block; width: 100%; padding: 0 15px; font-size: 16px; line-height: 45px; border-radius:3px; position: relative; z-index: 0; } #ticket_menu ul.list_store li a { background: #fefefe; /*background: #333331; color: #f0f0f0;*/} #ticket_menu ul.list_store li a:after {position: absolute; top: 50%; right: 12px; font-size: 12px; font-family: 'themify';content: "\e649"; z-index: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%);} #ticket_menu ul.list_store li span { color: #999; } #ticket_menu ul.list_store li .t_soldout {display: inline-block; width: auto; padding: 0; background: none; color: #f17b4d; font-size: .9em; vertical-align: 0;} #ticket_menu ul.list_store li a b {font-size: .85em; font-weight: 400;vertical-align: 0;} /* soldout */ #ticket_menu ul.list_store li span.soldout { background: #f5f5f5;line-height: 1.3; height: 45px; } ul.nav_list_sp li .soldout .inner { position: absolute; top: 50%; left: 20px; right: 20px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 0;} ul.nav_list_sp li .soldout .t_small { margin: 0 0 0 5px; font-size: .85em; vertical-align: 0;} @media only screen and (min-width:961px) { #ticket_menu ul.list_store li a:hover{ background: rgba(254,254,254,.7);} } @media only screen and (max-width: 960px) { #ticket_menu .ticket_item .t_ttl_ticket { font-size: 15px;} #ticket_menu .ticket_item .t_ttl_ticket_bus {font-size: 14px;} #ticket_menu .ticket_item .t_price { font-size: 18px;} /*#ticket_menu .store_area { margin: 12px 0 0;}*/ #ticket_menu ul.list_store { margin: 0;} #ticket_menu ul.list_store li { display: block; } #ticket_menu ul.list_store li+li {margin: 6px 0 0;} #ticket_menu ul.list_store li a, #ticket_menu ul.list_store li span {padding: 0 12px; font-size: 16px; line-height: 45px; } #ticket_menu ul.list_store li span.soldout { line-height: 1.3;} ul.nav_list_sp li .soldout .inner { position: absolute; top: 50%; left: 20px; right: 20px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 0;} } @media only screen and (max-width: 738px) { #ticket_menu .ticket_item .t_ttl_ticket { padding: 0 5px; font-size: 15px;} #ticket_menu .ticket_item .t_price { font-size: 16px;} /* t_detail_ticket */ #ticket_menu .t_detail_ticket { margin:5px 0 0; font-size: 12px; letter-spacing: .025em; line-height: 1.55;} #ticket_menu .t_detail_ticket+.t_detail_ticket {margin: 0;} #ticket_menu .store_area { margin: 10px 0 0;} #ticket_menu ul.list_store { margin: 0;} #ticket_menu ul.list_store li { display: block; } #ticket_menu ul.list_store li+li {margin: 5px 0 0;} #ticket_menu ul.list_store li a, #ticket_menu ul.list_store li span {padding: 0 12px; font-size: 15px; line-height: 40px; } #ticket_menu ul.list_store li a:after { font-size: 12px; } #ticket_menu ul.list_store li span.soldout { line-height: 1.3; height: 40px;} } @media only screen and (max-width: 560px) { #ticket_menu .ticket_area .t_ttl_event { font-size: 13px; line-height: 1.4;} #ticket_menu .ticket_area .t_ticket {font-size: 13px;letter-spacing: .025em;} #ticket_menu .ticket_area .t_ttl_event .t_sizeL { margin-top: 0; font-size: 16px;} } @media only screen and (max-width: 320px) { #ticket_menu .ticket_item .t_ttl_ticket {font-size: 14px; margin-right: 10px;} #ticket_menu .ticket_item .t_ttl_ticket_bus {font-size: 15px;} #ticket_menu .ticket_item .t_price { margin: 3px 0 0; } #ticket_menu .t_detail_ticket { margin:5px 0 0; font-size: 12px; letter-spacing: .025em; line-height: 1.55;} } /* --------------------------------------------------------------------------------------------------- 　.language_area --------------------------------------------------------------------------------------------------- */ .language_area { position: fixed; bottom: 30px; left: 2.5%; width: 80px; z-index: 4;background: #fafafa;border-radius:3px; -webkit-border-radius:3px; } .language_area:after {position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: "";border-radius:3px; -webkit-border-radius:3px;box-shadow: 0px 0px 10px rgba(0, 0, 0, .1);-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .1); z-index: -1;} .language_area ul.list_language {list-style: none;width: 100%; padding: 1px; display: flex; flex-wrap: wrap; justify-content:space-between; } .language_area ul.list_language li { width: 50%; text-align: center; text-align: center;} .language_area ul.list_language li a, .language_area ul.list_language li span {display: block; color: #202020;font-size:14px; font-family: 'inter' ;font-weight: 400; line-height: 30px; font-feature-settings : "palt" 1; letter-spacing: 0.025em;} .language_area ul.list_language li .jp {border-radius:3px 0 0 3px; -webkit-border-radius:3px 0 0 3px;} .language_area ul.list_language li .en {border-radius:0 3px 3px 0; -webkit-border-radius:0 3px 3px 0;} .language_area ul.list_language li .current { background: #f1e90b; color: #202020; } @media only screen and (min-width: 961px) { .language_area ul.list_language li a:hover {color: #111;} } @media only screen and (max-width: 960px) { .language_area { bottom: 25px; } } @media only screen and (max-width: 738px) { .language_area { bottom: 27px; left: 2.5%; width: 65px;} .language_area ul.list_language li a, .language_area ul.list_language li span{font-size:13px; line-height: 28px; } } /* --------------------------------------------------------------------------------------------------- 　footer --------------------------------------------------------------------------------------------------- */ footer { margin: 0; padding: 35px 2.5%;background: #1f1f1d; color: #edebe9;position: relative; z-index: 0; } footer:before { position: absolute; top: 0; right: 0; left: 0; height: 0; content: ""; border-top: #2e2f2f 1px solid; z-index: 0;} @media screen and (max-width:738px) { footer {padding: 35px 2.5%;} } /* .logo_area */ footer .logo_area { position: absolute; top: 100px; left: 4%;} footer .logo_area .logo_img { width: 180px; } @media screen and (max-width: 960px) { footer .logo_area .logo_img { width: 160px; } } @media screen and (max-width: 738px) { footer .logo_area { position: static; margin: 15vw 0 0; width: 100%;} footer .logo_area .logo_img { width: 180px;} } @media screen and (max-width: 560px) { footer .logo_area { position: absolute; top: 70px; left: auto; right: 3.5%; text-align: right;margin:0;} footer .logo_area .logo_img { width: 40vw;} } /* .copyrightArea */ footer .copyright_area { position: relative; z-index: 1;} footer .copyright_area p.txt_copy { padding: 0 0 0 1.1em; font-size: 15px;font-weight: 400; letter-spacing: 0.01em; line-height:1; position: relative; z-index: 0; text-align: center;} footer .copyright_area p.txt_copy span { margin-right: .01em;} @media screen and (max-width: 560px) { footer .copyright_area p.txt_copy { padding: 0; font-size:14px; text-align: center;} footer .copyright_area p.txt_copy span {position: static;} } @media screen and (max-width: 320px) { footer .copyright_area p.txt_copy { font-size:13px;} } /* --------------------------------------------------------------------------------------------------- 　#scrollUp --------------------------------------------------------------------------------------------------- */ #scrollUp { position: absolute; bottom: 37px; right: 40px; z-index: 1000; } #scrollUp a { padding-right: 32px; display: block;border:none;font-size: 15px; font-weight: 400;line-height: 1; letter-spacing: 0.025em; text-align: right; position:relative; z-index:1;} #scrollUp a:before { position:absolute; top:0;right:0; bottom:0; margin: auto 0; width: 25px; height: 25px; content: ""; background: url("../images/common/arrow_top_w.png") center center no-repeat; background-size: contain; z-index: 0;-webkit-transition: top 0.3s ease; transition: top 0.3s ease;} @media only screen and (min-width: 961px) { #scrollUp a:hover:before {top: -8px;} } @media only screen and (max-width: 738px) { #scrollUp { position: absolute; bottom: 18px; right: 2.5%; } #scrollUp a { padding:0; width: 50px; height: 50px; display: block;border:none;font-size: 0;} #scrollUp a:before {left: 0; margin: auto; width: 25px; height: 25px; } } /* --------------------------------------------------------------------------------------------------- 　.central --------------------------------------------------------------------------------------------------- */ .central { max-width: 1300px; margin: 0 auto; position: relative; } /* --------------------------------------------------------------------------------------------------- 　.headline --------------------------------------------------------------------------------------------------- */ .headline { position: relative; z-index: 0; } .t_ttl_content_m {font-size: 22px;font-family: 'inter', monospace; font-family: 'Inter', sans-serif; font-weight: 500; line-height: 1.5;font-feature-settings : "palt" 1; letter-spacing: 0.015em; } @media only screen and (max-width: 960px) { .headline { text-align: center;} } @media only screen and (max-width: 738px) { .t_ttl_content_m {font-size: 18px;} } /* --------------------------------------------------------------------------------------------------- 　.delighter --------------------------------------------------------------------------------------------------- */ .fade_in.delighter {transition: opacity .5s ease-out;opacity: 0.2;} .fade_in.delighter.started {opacity: 1;} .fade_in.delighter.ended {opacity: 1;} /* --------------------------------------------------------------------------------------------------- 　link --------------------------------------------------------------------------------------------------- */ /*#link_home_about, #link_home_overview, #link_home_artist, #link_home_access { position: relative; z-index: 0;} #link_home_about:before{display: block;height: 0px;margin-top: 0px;content: "";} #link_home_overview:before, #link_home_artist:before, #link_home_access:before {display: block;height: 70px;margin-top: -70px;content: "";} @media only screen and (max-width: 960px) { #link_home_overview:before, #link_home_artist:before, #link_home_access:before {height: 60px;margin-top: -60px;} } @media only screen and (max-width: 560px) { #link_home_overview:before, #link_home_artist:before, #link_home_access:before { height: 50px;} }*/ #link_home_about, #link_home_overview, #link_home_artist, #link_home_vip, #link_home_access, #link_home_notice{ position: relative; z-index: 0;} #link_home_about:before, #link_home_overview:before, #link_home_artist:before, #link_home_vip:before, #link_home_access:before, #link_home_notice:before{display: block;height: 70px;margin-top: -70px;content: "";} @media only screen and (max-width: 960px) { #link_home_about:before, #link_home_overview:before, #link_home_artist:before, #link_home_vip:before, #link_home_access:before, #link_home_notice:before{height: 60px;margin-top: -60px;} } @media only screen and (max-width: 560px) { #link_home_about:before, #link_home_overview:before, #link_home_artist:before, #link_home_vip:before, #link_home_access:before, #link_home_notice:before{ height: 50px;} }