﻿@charset "UTF-8";

/* -------------------------
 * header
 * ------------------------- */

.navbar-static-top, #page-header button {
	z-index: 10;
}
.ocp #srtHeader {
	display: none;
}
.ocp div#srtHeaderSP a,
.ocp div#srtHeaderSP a:hover,
.ocp div#srtHeaderSP a:visited {
	color: #fff;
}
.ocp div#srtHeaderSP.active a:hover {
	text-decoration: none;
}
.ocp #srtHeaderSP {
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	text-align: left;
	display: table;
	visibility: hidden;
	padding-top: 60px;
}
.ocp #srtHeaderSP.active {
	visibility: visible;
}
.ocp #srtHeaderSP ul {
	position: fixed;
	right: 0;
	top: 0;
	padding-top: 45px;
	width: 75%;
	height: 100%;
	background-color: #555;
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
	-webkit-transition: all .4s ease-out;
	transition: all .4s ease-out;
	vertical-align: middle;
	z-index: 10;
}
.ocp #srtHeaderSP.active ul {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.ocp #srtHeaderSP ul li {
	padding-top: 0;
	padding-bottom: 0;
}
.ocp #srtHeaderSP ul li:last-child {
	border-bottom: 1px solid #fff;
}
.ocp #srtHeaderSP ul li a {
	position: relative;
	border-top: 1px solid #fff;
	padding: 13px 15px 12px;
	display: block;
	color: #fff;
	font-size: 13px;
	text-decoration: none;
}
.ocp #srtHeaderSP ul li a.active {
	color: #555;
	background-color: #fff;
}
.ocp #srtHeaderSP:after {
	display: block;
	content: "";
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-transition: all .4s ease-out;
	transition: all .4s ease-out;
}
.ocp #srtHeaderSP.active:after {
	background-color: rgba(0,0,0,.5);
}
.ocp #srtHeaderSPToggle {
	margin: 0;
	position: fixed;
	z-index: 1035;
	top: 103px;
	right: 0;
	background-color: #555;
	border-radius: 0 0 0 6px;
	-webkit-transition: all .1s ease-in-out;
	transition: all .1s ease-in-out;
	outline: 0;
	height: 24px;
	box-shadow: 0 0 3px rgba(0,0,0,.3);
}
.ocp #srtHeaderSPToggle span {
	background: #fff;
}
.ocp #srtHeaderSPToggle .icon-bar {
	position: relative;
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.ocp #srtHeaderSPToggle.active {
	top: 0;
	border: 1px solid #555;
	box-shadow: 0 0 3px transparent;
	z-index: 100000;
}
.ocp #srtHeaderSPToggle.active .icon-bar:nth-of-type(1) {
	top: 6px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.ocp #srtHeaderSPToggle .icon-bar:nth-of-type(2) {
	top: 1px;
}
.ocp #srtHeaderSPToggle.active .icon-bar:nth-of-type(2) {
	background: transparent;
}
.ocp #srtHeaderSPToggle .icon-bar:nth-of-type(3) {
	top: 2px;
}
.ocp #srtHeaderSPToggle.active .icon-bar:nth-of-type(3) {
	top: -6px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.ocp #srtHeaderSPToggle .icon-bar {
	position: relative;
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.ocp .navbar-toggle {
	padding: 9px 10px;
}
@media screen and (max-width: 767px) {
.ocp #srtHeader #srt_gNavi {
	display: none;
}
}