@charset "UTF-8";
/* CSS Document */

/****************************************************/
/**   全体レイアウト    **/
/****************************************************/
.wrapper{
	position: relative;    
    height: auto !important;
    height: 100%;
	min-height: 100%;
}

.box_container{
	width:100%;
	max-width:1000px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	overflow:hidden;
	box-sizing: border-box;
}



/****************************************************/
/**   ヘッダー    **/
/****************************************************/
header{
	width:100%;
	
}

header .head_top{
	height:60px;
	background-color: rgba(26,158,160,1.0);
}

header h1{
	padding: 15px 15px;
}
header h1 img{
	height: 30px;
	width: auto;
}


header .login_area{
	background-color: rgba(216,223,223,1.0);
	position: relative;
	height: 34px;
	padding: 4px 0 4px 15px;
	box-sizing: border-box;
	font-size: 80%;
}

header .login_area p{
	line-height: 26px;
}


header .login_area p.login_name > span{
	font-weight: bold;
	display: inline-block;
	margin-right: 5px;
}

header p.btn_logout{
	position: absolute;
	top:4px;
	right: 15px;
	height: 26px;	
	padding: 0 10px;
	background-color:rgba(255,255,255,1.0);
	color:rgb(0,0,0);
	text-align: center;
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;	
}


header p.btn_logout i{
	margin-right: 5px;
}


/****************************************************/
/**   SPナビ    **/
/****************************************************/
.sp_nav{
	position:fixed;
	top: 0px;
	right: 0px;
	display:block;
	height:60px;
	width:60px;
	text-align:center;
	line-height:60px;
	font-size:30px;
	color:#FFFFFF;
	z-index: 9999;
}


.sp_nav_btn, .sp_nav_btn_bar {
	-webkit-transition-duration: .4s;
	transition-duration: .4s;
	transition-timing-function: cubic-bezier(.25,.46,.45,.94);
}

.sp_nav_btn {
	width: 60px;
	height: 60px;
	cursor: pointer;
	position: fixed;
	top: 0px;
	right: 0;
	z-index: 101;

}
.sp_nav_btn, .sp_nav_btn_bar {
	-webkit-transition-timing-function: cubic-bezier(.25,.46,.45,.94);
}

.sp_nav_btn, .sp_nav_btn_bar {
	-webkit-transition-duration: .4s;
	transition-duration: .4s;
	transition-timing-function: cubic-bezier(.25,.46,.45,.94);
}
.sp_nav_btn_bar_top {
	-webkit-transform: translate(0,-8px);
	-ms-transform: translate(0,-8px);
	transform: translate(0,-8px);
}

.sp_nav_btn_bar_bottom {
	-webkit-transform: translate(0,8px);
	-ms-transform: translate(0,8px);
	transform: translate(0,8px);
}
.sp_nav_btn_bar {
	width: 20px;
	height: 2px;
	position: absolute;
	top: 29px;
	left: 20px;
	background-color: #fff;
}
.sp_nav_btn, .sp_nav_btn_bar {
	-webkit-transition-timing-function: cubic-bezier(.25,.46,.45,.94);
}

.sp_nav.is-opened{
	position: fixed;
	z-index: 999999;
}


.sp_nav.is-opened .sp_nav_btn_bar_top {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
.sp_nav.is-opened .sp_nav_btn_bar_middle {
	width: 0;
	-webkit-transform: translate(10px,0);
	-ms-transform: translate(10px,0);
	transform: translate(10px,0);
}
.sp_nav.is-opened .sp_nav_btn_bar_bottom {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/**   格納メニュー    **/	
.responsive_menu_wrap{
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 9997;
	background-color: rgba(0,0,0,0.5);
	min-height: 100%;
    height: auto !important;
    height: 100%;
	display: none;		
}	

.responsive_menu_wrap.show{
	display: block;
}

.responsive_menu{
	position: fixed;
	z-index: 9998;
	top: 0;
	right: -600px;
	height: 100%;
	width: 100%;
	max-width: 600px;
	background-color: rgba(34,34,34,.95);
	display: block;	
	overflow-y:scroll;
	-webkit-overflow-scrolling: touch
}

.responsive_menu::-webkit-scrollbar {
  display: none;
}

.responsive_menu .inner_menu{
	margin:30px;
	color:rgba(255, 255, 255, 0.6);
	padding: 0;
}

.responsive_menu .inner_menu p.menu_title{
	color:rgb(255,255,255);
	margin-bottom:30px;
	text-align:center;
	letter-spacing:3px;
	font-weight:bold;
}

.responsive_menu .inner_menu ul{
	margin-bottom:30px;
}

.responsive_menu .inner_menu li{
	letter-spacing: normal;
	border-bottom:rgba(255, 255, 255, 1.0) solid 1px;
	box-sizing:border-box;
	width: 100%;
	height:50px;
	line-height:50px;	
}

.responsive_menu .inner_menu li a{
	text-decoration:none;
	color:rgba(255,255,255,1.0) !important;
	width:100%;
	height: 100%;
	display: block;
	overflow: hidden;

}

.responsive_menu .inner_menu li i{
	margin-right:20px;
}

.responsive_menu .inner_menu p.btn_logout{
	background-color: rgb(255,255,255);
	color: rgb(0,0,0);
	width: 100%;	
	text-align: center;
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	padding: 10px;
	box-sizing: border-box;
}

p.btn_logout a{
	width:100%;
	height: 100%;
	display: block;
	overflow: hidden;
	color:rgb(0,0,0) !important;
}


/****************************************************/
/**   メインエリア    **/
/****************************************************/
article{
	width:100%;	
	padding-bottom: 50px;
}

section.under_construction p{
	text-align: center;
	padding-top: 100px;
}

/****************************************************/
/**   message    **/
/****************************************************/
#message_wrapper{
	background:rgba(0,0,0,0.8);
	position: fixed;
	justify-content: center;
	align-items: center;
	z-index: 10000;
	width: 100%;
	height: 100%;
	display: none;

}

#message_wrapper > p{
	color: rgb(255,255,255);
	font-size: 100%;
	text-align: center;
	padding: 0 15px;
}




/****************************************************/
/**   フッター    **/
/****************************************************/
footer{
	position:absolute;
	bottom:0;
	width:100%;
	height:50px;
	text-align: center;
}

footer p.copyright{
	color:rgb(26,158,160);
	font-family: "acumin-pro-semi-condensed";	
	font-weight: 500;
	font-size: 0.8em;
}