/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Rajdhani:300,400,500,600,700);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

* {
	margin: 0;
	padding: 0;
}

body {
  width: 100%;
  height: auto;
  overflow-x: hidden;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 1.1em;
  background: url(../img/bg_body.png) left top repeat;
  color: #000;
}

p, a {
  color: #000;
  text-decoration: none;
}



ul {
	list-style: none;
}
span.clear {
	width: 100%;
	height: 1px;
	margin: 0;
	padding: 0;
	line-height: 0;
	display: block;
	float: none;
	clear: both;
}
#fade {
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 50;
}
iframe {
	border: none;
}

#wrappar {
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

/* common
--------------------------- */

span.date {
	font-family: 'Rajdhani', sans-serif;
	color: #FFF;
	font-size:16px;
	font-weight: 600;
}
a.rtn_top {
	width: auto;
	height: auto;
	margin: 0 auto;
	padding: 1px 35px;
	border: #FFF solid 1px;
	font-family: 'Rajdhani', sans-serif;
	font-size: 18px;
	font-weight: 600;
	color: #FFF;
	float: none;
	clear: both;
}


/* header
--------------------------- */

#header {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 15px 0 10px 0;
	overflow: hidden;
	position: fixed;
	z-index: 9999;
	border-bottom: #000 solid 1px;
	background: #FFF;
}
#header div.head_wrap {
	width: 1280px;
	height: auto;
	margin: 0 auto;
}
#header h1 {
	width: 130px;
	height: auto;
	float: left;
	margin: 0;
	padding: 0;
	font-size: 0;
	position: relative;
	z-index: 2;
}
#header h1 img {
	width: 100%;
	height: auto;
}

#header ul.gnavi {
	float: right;
}
#header ul.gnavi li {
	float: left;
	padding: 8px 30px 0 0;
}
#header ul.gnavi li a {
	font-family: 'Rajdhani', sans-serif;
	font-size: 16px;
	font-weight: 600;
	position: relative;
	padding: 0 5px;
}
#header ul.gnavi li a::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 100%;
  height: 3px;
  -webkit-transform: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#header ul.gnavi li a:hover::after {
  -webkit-transform: scaleX(1);
  -ms-transform: scaleX(1);
  transform: scaleX(1);
}
#header ul.gnavi li a.navi01::after {
	background: #1fa3cf;
}
#header ul.gnavi li a.navi02::after {
	background: #f0f032;
}
#header ul.gnavi li a.navi03::after {
	background: #f03232;
}
#header ul.gnavi li a.navi04::after {
	background: #c864c8;
}
#header ul.gnavi li a.navi05::after {
	background: #32967d;
}
#header ul.gnavi li a.navi06::after {
	background: #c8c8c8;
}
#header ul.gnavi li a.navi07::after {
	background: #10569D;
}

.navi_new{
	font-size:10px;
	padding:4px 2px 2px 4px;
	background:#FF3636;
	position:relative;
	top:-2px;
	color:#fff;
	margin:0 6px 0 0;
}

#header ul.sns {
	float: right;
	margin: 0;
	position: relative;
	z-index: 2;
}
#header ul.sns li {
	margin: 5px 0 0 0;
	display: block;
	float: left;
	text-align: center;
}
#header ul.sns li a {
	width: 23px;
	height: 23px;
	text-align: center;
	vertical-align: middle;
	display: block;
}
#header ul.sns li a span {
	font-size: 23px;
}

@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot?3x6o3m');
	src:url('../fonts/icomoon.eot?#iefix3x6o3m') format('embedded-opentype'),
		url('../fonts/icomoon.ttf?3x6o3m') format('truetype'),
		url('../fonts/icomoon.woff?3x6o3m') format('woff'),
		url('../fonts/icomoon.svg?3x6o3m#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-fb:before {
	content: "\e600";
}

.icon-gg:before {
	content: "\e601";
}
.icon-ig:before {
	content: "\e602";
}
.icon-ln:before {
	content: "\e603";
}
.icon-pt:before {
	content: "\e604";
}
.icon-tw:before {
	content: "\e605";
}
.icon-yt:before {
	content: "\e606";
}


/* footer
--------------------------- */

#footer {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding:  25px 0;
	overflow: hidden;
	text-align: center;
	float: none;
	clear: both;
	background: #000;
}

#footer ul.sns li {
	margin: 3px 0 0 0;
	display: block;
	float: left;
	text-align: center;
}
#footer ul.sns li a {
	width: 23px;
	height: 23px;
	text-align: center;
	vertical-align: middle;
	display: block;
}
#footer ul.sns li a span {
	font-size: 23px;
	color: #FFF;
}

p.copy {
	font-family: 'Rajdhani', sans-serif;
	font-style: normal;
	font-size: 10px;
	float: left;
	padding: 5px 10px 0 49.3%;
	margin: 0 0 0 -105px;
	color: #FFF;
}

p.pp {
	font-family: 'Rajdhani', sans-serif;
	font-style: normal;
	font-size: 10px;
	float: left;
	padding: 5px 10px 0 0;
	margin: 0 0 0 10px;
	color: #FFF;
	display:block;
}

/* Media Queries - Tablet */
@media (max-width: 768px) {
	#loader video {
		display: none;
	}

	#wrappar {
		min-width: 600;
	}
	#header div.head_wrap {
		width: 100%;
		margin: 0;
	}
	#header {
		overflow: visible;
	}
	#header h1 {
		padding: 0 0 0 10px;
	}
	#header ul.sns {
		margin: 0 40px 0 0;
	}
	#header ul.gnavi {
		width: 100%;
		height: auto;
		position: absolute;
		right: 0;
		top: 20px;
		z-index: 1;
	}
	#header ul.gnavi li {
		float: none;
		clear: both;
		padding: 10px 0 10px 5px;
		border-top: #CCC solid 1px;
		background: #FFF;
	}
	#header ul.gnavi li:last-child {
		border-bottom: #CCC solid 1px;
	}
	#header ul.gnavi li a::after {
		display: none;
	}
}

