.logotype-header { position: relative; z-index: 5; }
.logotype-header h3 { color: #fff; font-size: 17px; font-family: 'Lintel W00'; letter-spacing: 1px; }
.logotype-header .cell { vertical-align: top; }
.logotype-header .table { width: 100%; }
.logotype-header .buttons { width: 430px; }
.logotype-header .buttons a { float: left; }
.logotype-header .buttons a:first-child { margin-right: 30px; }
.logotype-control li { display: inline-block; vertical-align: top; }
.logotype-body { margin-bottom: 200px; position: relative; z-index: 5; }
.logotype-control li span { cursor: pointer; display: block; text-align: center; font-family: 'Lintel W00'; font-size: 12px; font-weight: bold; width: 80px; color: rgba(255, 255, 255, 0.2); border-bottom: 1px solid rgba(255, 255, 255, 0.1); height: 48px; line-height: 48px; letter-spacing: 1px; }
.logotype-control li.active span { color: rgba(255, 255, 255, 1); border-bottom: 1px solid rgba(255, 255, 255, 1); }
.logotype-scroll ul { font: 0; }
.logotype-scroll ul li { transition: all 0.3s; float: left; position: relative; }
.logotype-scroll ul li span.t { transition: all 0.3s; font-family: 'aircord'; display: block; font-size: 120px; height: 120px; line-height: 120px; width: 100%; position: absolute; top: 50%; left: 0; margin-top: -60px; color: #fff; text-align: center; }
.logotype-scroll ul li span.n { font-family: 'Lintel W00'; font-size: 12px; color: rgba(255, 255, 255, 0.3); bottom: 0; margin: 0; right: 0px; position: absolute; }
.mCSB_inside>.mCSB_container { margin-right: 0; }
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 1px; }
.mCSB_scrollTools { width: 1px; opacity: 0.1; }
.mCSB_scrollTools { height: 300px; top: 50%; margin-top: -150px; }
.mCSB_scrollTools .mCSB_draggerRail { background-color: rgba(255, 255, 255, 0.1); }
.js-logotype-render-ol { position: relative; margin-bottom: 100px; }
#js-logotype-render { position: absolute; top: 50%; left: 50%; }
.js-logotype-control { position: absolute; bottom: 0; z-index: 2; font-size: 0; display: table; width: 100%; }
.js-logotype-control li { display: table-cell; width: 2.77777778%;}
.js-logotype-control span { cursor: pointer; font-family: 'aircord'; color: rgba(255, 255, 255, 0.1); display: block; text-align: center; font-size: 22px; }
.js-logotype-control .active span { color: rgba(255, 255, 255, 1); }

/* PAD */
.is_pad .subpages-logotype-header.subpages-header { min-height: 100px; padding: 110px 0 0 0; }
.is_pad .logotype-header .cell { display: block; }
.is_pad .logotype-header .cell:first-child { margin-bottom: 50px; }

/* SP */
.is_sp .subpages-logotype-header.subpages-header { min-height: auto; }
.is_sp .logotype-header .cell { display: block; }
.is_sp .logotype-header .cell:first-child { margin: 30px 0; }
.is_sp .logotype-header h3 { font-size: 14px; color: rgba(255, 255, 255, 0.8); }
.is_sp .logotype-header h3 br { display: none; }
.is_sp .logotype-header .buttons a, .is_sp .logotype-header .buttons a:first-child { margin: 0 auto; box-sizing: border-box; }
.is_sp .logotype-header .buttons a:first-child { border-right: 1px solid rgba(255, 255, 255, 0.1); }
.is_sp .logotype-header .table { display: block; }
.is_sp .js-logotype-control li { display: inline-block; vertical-align: middle; }
.is_sp .logotype-header .buttons { width: 100%; }
.is_sp .logotype-header .button { width: 50%; }
.is_sp .logotype-header .button .svg svg { display: none; }
.is_sp .logotype-header .buttons { border: 1px solid rgba(255, 255, 255, 0.1); }
.is_sp .logotype-body, .is_sp .js-logotype-render-ol { position: relative; margin-bottom: 50px; }
.is_sp .logotype-scroll { margin-top: 30px; }
.is_sp .js-logotype-control li { width: 10%; height: 30px; }
.is_sp .js-logotype-control { bottom: -120px; }
.is_sp .js-logotype-render-ol { position: relative; margin-bottom: 160px; }

/* VIMEO */
.logotype-vimeo iframe { width: 100%; height: 620px; }
.logotype-vimeo { margin-bottom: 100px; }
.is_pad .logotype-vimeo iframe { height: 460px; }
.is_sp .logotype-vimeo iframe { height: 220px; }
.is_sp .logotype-vimeo { margin-bottom: 50px; }