@charset "UTF-8";
/*
 * cmn_layout.css
 *
 */


/* !HTML5 elements
---------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{ display: block;}

/* !Reseting
---------------------------------------------------------- */
body {
	font-family: 'Noto Sans Japanese', sans-serif;
	font-size: 16px;
	font-weight: 300;
	-webkit-text-size-adjust: none;
	line-height: 1.8;
	color: #222;
	overflow-x: hidden;
}

@media screen and (max-width:1039px){
body {
	font-size: 15px;
}
}

@media screen and (max-width:767px){
body {
	font-size: 14px;
}
}

body, div, pre, p, blockquote, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, th, td, figure, figcaption
{ margin: 0; padding: 0;}

input, textarea
{ margin: 0; font-size: 100%;}

label
{ cursor: pointer;}

table
{ border-collapse: collapse; border-spacing: 0; font-size: 100%;}

fieldset, img
{ border: 0;}

img
{ max-width: 100%; height: auto; vertical-align: top;}

address, caption, cite, code, dfn, em, th, var
{ font-style: normal; font-weight: normal;}

ol, ul
{ list-style: none;}

caption, th
{ text-align: left;}

h1, h2, h3, h4, h5, h6
{ font-size: 100%; font-weight: normal;}

q:after, q:before
{ content:'';}

a
{ cursor: pointer; }

a, input
{ outline: none; }

input, textarea
{ border-radius: 0; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3" , "Hiragino Kaku Gothic ProN" , 'メイリオ' ,Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic" , Verdana, Arial, Helvetica, sans-serif;}

input[type="button"],input[type="submit"],input[type="reset"]
{ -webkit-appearance: none; background: none; border: none; padding: 0; cursor: pointer;}

abbr, acronym
{ border: 0;}
*
{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}

@font-face {
  font-family: 'BebasNeue';
  font-weight: normal;
  font-style: normal;
  src: url("../fonts/BebasNeue.woff") format("woff")
}

@font-face {
  font-family: 'BebasNeue';
  font-weight: 200;
  font-style: normal;
  src: url("../fonts/BebasNeue-Regular.woff") format("woff")
}
/* !Clearfix
---------------------------------------------------------- */
.clearfix,
#contents,
.section
{
	display: block;
	min-height: 1%;
}
.clearfix:after,
#contents:after,
.section:after
{
	clear: both;
	content:".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html .clearfix,
* html #contents,
* html .section
{
	height: 1%;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}
/* !Layout
---------------------------------------------------------- */
html { overflow-y: scroll;}
body { 
	text-align: left;
	position:relative;
}
@media print {
	html,
	html body { *zoom: 0.65;}
}

/* !header
---------------------------------------------------------- */
#overlay {
	display: none;
	position: fixed;
	background: rgba(0,0,0,.6);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

a#panel-btn {
	display: none;
}
	
#sidebar {
	/*display: none;*/
	padding-top: 160px;
	position: fixed;
	right: -320px;
	top: 0;
	height: 100%;
	width: 320px;
	background-color: rgba(34,34,34,1);
	background:url(../img/sidebar_bg.png) 0 0 repeat;
	-webkit-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}
	#global-nav ul {
		width:100%;
		height:auto;
		float:none;
	}
	#global-nav ul li {
		position: relative;
		width:100%;
		float:none;
		text-align:center;
		margin:0;
	}
	#global-nav ul li.norm a {
		padding: 0;
		height:60px;
		line-height:60px;
		font-size:16px;
		font-weight:bold;
		color:#FFF;
		letter-spacing:0.1em;
		transition: .5s;
	}
		#global-nav ul li.norm a:hover {
			opacity:.5;
		}
		#global-nav ul li.norm a.current {
			opacity:.5;
		}

	/* nav open */
	.open {
		overflow: hidden;
	}
	.open #overlay {
		display: block;
	}
	.open #sidebar  {
		-webkit-transform: translate3d(-100%,0,0);
		transform: translate3d(-100%,0,0);
	}
	
a#entryBtn {
	width: 80px;
	height: 80px;
	display: block;
	float:right;
	background:#E30000;
	line-height:80px;
	font-family: BebasNeue;
	font-size:20px;
	text-align:center;
	font-weight:normal;
	color:#FFF;
	letter-spacing:0.06em;
	position:fixed;
	top:0;
	right:80px;
	z-index:401;
	transition: .5s;
}

a#entryBtn:hover {
	background:#FF5151;
}
	
a#panel-btn {
	width: 80px;
	height: 80px;
	display: block;
	float:right;
	position:fixed;
	top:0;
	right:0;
	z-index:400;
}

#panel-btn{
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
	background: #222;
	transition: .5s;
}
#panel-btn:hover{
	background: #555;
}
#panel-btn-icon{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 30px;
	height: 2px;
	margin: -1px 0 0 -15px;
	background: #FFF;
	transition: .2s;
}
#panel-btn-icon:before, #panel-btn-icon:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 30px;
	height: 2px;
	background:#FFF;
	transition: .3s;
}
#panel-btn-icon:before{
	margin-top: -8px;
}
#panel-btn-icon:after{
	margin-top: 6px;
}
#panel-btn .close{
	background: transparent;
}
#panel-btn .close:before, #panel-btn .close:after{
	margin-top: 0;
}
#panel-btn .close:before{
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
#panel-btn .close:after{
	transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
}

	/* z-index */
	#overlay {
		z-index: 70;
	}
	#sidebar {
		z-index: 300;
	}
	#panel-btn {
		z-index: 400;
	}
	
@media screen and (max-width:1039px){
	#global-nav ul li.norm a:hover {
		opacity:1;
	}

a#entryBtn {
	transition:none;
}

a#entryBtn:hover {
	background:#E30000;
}

#panel-btn{
	transition:none;
}
#panel-btn:hover{
	background:#222;
}
}

@media screen and (max-width:767px){
#sidebar {
	/*display: none;*/
	padding-top: 140px;
	right: -100%;
	width: 100%;
}
	#global-nav ul li.norm a {
		height:55px;
		line-height:55px;
	}
}

@media screen and (max-width:360px){
#sidebar {
	/*display: none;*/
	padding-top: 120px;
}
	#global-nav ul li.norm a {
		height:50px;
		line-height:50px;
	}
}

@media screen and (max-width:340px){
#sidebar {
	/*display: none;*/
	padding-top: 110px;
}
	#global-nav ul li.norm a {
		height:40px;
		line-height:40px;
	}
}

/* !pageTop
---------------------------------------------------------- */
.pagetop {
	display: none;
	position: fixed;
	bottom: 0;
	right: 0;
	z-index:60;
}
	.pagetop a:link,
	.pagetop a:visited{
		display: block;
		width: 50px;
		height: 50px;
		text-align: center;
		color: #FFF;
		font-size: 20px;
		text-decoration: none;
		background:#222;
		line-height: 50px;
		transition: all 0.2s ease;
	}
	
	.pagetop a:hover{
		line-height: 60px;
		width: 60px;
		height: 60px
	}
	
@media screen and (max-width:1039px){
.pagetop a:link,
.pagetop a:visited{
	display:none;
}
}

@media screen and (max-width:767px){

}

/* !footer
---------------------------------------------------------- */
#footer {
	width: 100%;
	background:#222;
	padding:80px 0 50px 0;
	overflow:hidden;
}
	#footer p.footerLogo a {
		display:block;
		width:220px;
		height:50px;
		margin:0 0 30px 8%;
	}
		#footer p.footerLogo a img {
			display:block;
			width:93px;
			height:50px;
			float:left;
		}
		#footer p.footerLogo a span {
			font-family: BebasNeue;
			height:50xp;
			line-height:50px;
			font-size:20px;
			color:#FFF;
			letter-spacing:0.06em;
			float:right;
		}
	#footer ul.footerLinks {
		margin:0 0 5px 8%;
	}
		#footer ul.footerLinks li {
			display:inline;
			margin-right:40px;
		}
			#footer ul.footerLinks li:last-child {
				margin-right:0;
			}
			#footer ul.footerLinks li a {
				font-size:87%;
				color:#FFF;
				transition: all 0.5s ease;
			}
				#footer ul.footerLinks li a:hover {
					opacity:0.5;
				}
	#footer a.footerCorpBtn {
		display:inline-block;
		font-size:12px;
		color:#999;
		position:relative;
		margin:0 0 60px 8%;
		padding-right:20px;
		transition: all 0.6s ease;
	}
		#footer a.footerCorpBtn:after {
			position:absolute;
			display:block;
			content:"";
			width:9px;
			height:7px;
			background:url(../img/icon_footer_corp_btn.png) 0 0 no-repeat;
			background-size:9px 7px;
			top:7px;
			right:0;
		}
		#footer a.footerCorpBtn:hover {
			opacity:.6;
		}
		
	#footer p.copyright {
		clear:both;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size:10px;
		color:#999;
		margin:0 0 0 8%;
	}

@media screen and (max-width:1039px){
#footer {
	width: 100%;
	background:#222;
	padding:60px 0 40px 0;
	overflow:hidden;
}
	#footer p.footerLogo a {
		margin:0 0 30px 5%;
	}
	#footer ul.footerLinks {
		margin:0 0 5px 5%;
	}
	#footer ul.footerLinks li {
		margin-right:30px;
	}
		#footer ul.footerLinks li a {
			transition: none;
		}
			#footer ul.footerLinks li a:hover {
				opacity:1;
			}
	#footer a.footerCorpBtn {
		margin:0 0 60px 5%;
		transition: none;
	}
		#footer a.footerCorpBtn:hover {
			opacity:1;
		}
	#footer p.copyright {
		margin:0 0 0 5%;
	}
}

@media screen and (max-width:767px){
#footer {
	padding:60px 0 30px 0;
}
	#footer p.footerLogo a {
		margin:0 auto 30px auto;
	}
	#footer ul.footerLinks {
		text-align:center;
		margin-bottom:30px;
	}
		#footer ul.footerLinks li {
			display:block;
			margin-right:0;
		}
			#footer ul.footerLinks li a {
				display:block;
				height:44px;
				line-height:44px;
				color:#FFF;
				font-weight:bold;
			}
	#footer a.footerCorpBtn {
		display:block;
		margin:0 auto 40px auto;
		padding-right:0;
		width:150px;
		text-align:center;
	}
	#footer p.copyright {
		margin:0;
		text-align:center;
	}
}

/* !Listing
---------------------------------------------------------- */
ul.iconList {
	width:100%;
}
	ul.iconList li {
		line-height:1.6;
		padding:0.6em 0.8em;
		background:#F0F0F0;
		border-radius:4px;
		margin-bottom:15px;
		padding-left:2em;
		text-indent:-1em;
	}
		ul.iconList li i.fa {
			display:inline-block;
			margin-left:0.8em;
			margin-right:0.4em;
			color:#DF0011;
		}
ul.circle li {
	list-style:circle;
	margin:0 0 10px 20px;
}
	ul.circle li:last-child {
		margin-bottom:0;
	}

ol.numList li {
	list-style:decimal;
	margin:0 0 15px 20px;
}
	ol.numList li:last-child {
		margin-bottom:0;
	}
	
@media screen and (max-width:1039px){
}

@media screen and (max-width:767px){
}

/* !Table
---------------------------------------------------------- */
.table_basic01 {
	width: 100%;
	max-width:1000px;
	margin-left:auto;
	margin-right:auto;
	border-collapse: separate;
	border-spacing:10px;
}
	.table_basic01 th,
	.table_basic01 td {
		padding: 1.2em 1em 1em 1.0em;
	}
	.table_basic01 th {
		width:25%;
		vertical-align:top;
		font-weight:bold;
		border-top:1px solid #E30000;
	}
		.table_basic01 tr:last-child th {
			border-bottom:1px solid #E30000;
			padding-bottom:20px;
		}
	.table_basic01 td {
		width:75%;
		vertical-align:top;
		border-top:1px solid #E5E5E5;
	}
		.table_basic01 tr:last-child td {
			border-bottom:1px solid #E5E5E5;
			padding-bottom:20px;
		}
	
@media screen and (max-width:1039px){
.table_basic01 th,
.table_basic01 td {
	padding: 1.2em 1em 1em 1.0em;
}
	.table_basic01 th {
		width:30%;
	}
	.table_basic01 td {
		width:70%;
	}
		.table_basic01 th.btm {
			padding-bottom:18px;
		}
		.table_basic01 td.btm {
			padding-bottom:18px;
		}

}

@media screen and (max-width:767px){
.table_basic01 {
	width: 100%;
	border-spacing:0;
}
	.table_basic01,
	.table_basic01 thead,
	.table_basic01 tbody,
	.table_basic01 tr,
	.table_basic01 th,
	.table_basic01 td {
		width: 100%;
		display: block;
		
	}
	.table_basic01 th,
	.table_basic01 td {
		padding: 1.2em 1.0em 1em 1.0em;
		border:1px solid #E5E5E5;
	}
	.table_basic01 th {
		background:#F3F3F3;
		font-weight:bold;
		border-bottom:0;
	}
		.table_basic01 td {
			border-bottom:0;
		}
		
		.table_basic01 tr:last-child th {
			border-bottom:none;
			padding-bottom:20px;
		}
		.table_basic01 tr:last-child td {
			border-bottom:1px solid #E5E5E5;
			padding-bottom:20px;
		}
}

/*フォーム--------------------------------------*/
span.label {
	display:inline-block;
	padding:1px 5px;
	background-color:#222;
	color:#FFF;
	font-size:10px;
	margin-left:7px;
}

input.norm {
	width:100%;
	background:#f0f0f0;
	border:0;
	padding:8px 10px;
}

input.short {
	width:50%;
	background:#f0f0f0;
	border:0;
	padding:8px 10px;
}

input.veryshort {
	width:20%;
	background:#f0f0f0;
	border:0;
	padding:8px 10px;
}

input.exshort {
	width:15%;
	background:#f0f0f0;
	border:0;
	padding:8px 10px;
}

select {
	border:1px solid #DEDEDE;
	padding:8px 10px;
}
	select option{
		margin-bottom:5px;
	}

textarea.short {
	width:100%;
	height:120px;
	background:#f0f0f0;
	border:0;
	padding:8px 10px;
}

textarea.norm {
	width:100%;
	height:180px;
	background:#f0f0f0;
	border:0;
	padding:8px 10px;
}

p.notes {
	font-size:87%;
	color:#666;
}

label.check {
	display:inline-block;
	padding:8px 12px;
	background:#f0f0f0;
	margin-bottom:10px;
}

input.btn_submit {
	padding:15px 30px;
	font-size:16px;
	background:#222;
	border:1px solid #222;
	color:#FFF;
	font-weight:bold;
	transition: all 0.5s ease;
}
	input.btn_submit:hover {
		background:#FFF;
		color:#222;
	}

input.btn_back {
	font-size:16px;
	background:#999;
	border:1px solid #999;
	padding:15px 30px;
	color:#FFF;
	font-weight:bold;
	transition: all 0.5s ease;
}
	input.btn_back:hover {
		background:#FFF;
		color:#999;
	}

@media screen and (max-width:1039px){
input.veryshort {
	width:30%;
}
input.exshort {
	width:22%;
}
input.btn_submit {
	transition: none;
}
	input.btn_submit:hover {
		background:#222;
		color:#FFF;
	}

input.btn_back {
	transition: none;
}
	input.btn_back:hover {
		background:#999;
		color:#FFF;
	}
}

@media screen and (max-width:767px){
input.norm {
	width:100%;
}

input.short {
	width:70%;
}

input.veryshort {
	width:40%;
}

input.exshort {
	width:22%;
}

label.check {
	width:100%;
}

textarea.norm {
	width:100%;
}

input.btn_submit {
	font-size:14px;
}

input.btn_back {
	font-size:14px;
}

input.btn_submit {
	padding:12px 20px;
}

input.btn_back {
	padding:12px 20px;
}
}