@charset "UTF-8";
/* Reset
============================================ */
body {
	font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
	-webkit-text-size-adjust: 100%;
	background: #F0E5C4;
}

/* reset */
	*:focus{ outline:none; }
	html,body,div,p,ul,ol,li,dl,dt,dd,pre,h1,h2,h3,h4,h5,h6,table,th,td,form,fieldset,input,textarea,select,img { margin: 0px; padding: 0px; }
	ul,ol { list-style: none; }
	table { border-collapse: separate; border-collapse: collapse\9; border-spacing: 0; }
	th,td { empty-cells: show; }
	caption,th { text-align: left; }
	img,fieldset { border: 0px; }
	img { vertical-align:middle; }
	em { font-style: normal; }
/* /reset */

/* clearfix */
	.cf:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
/* /clearfix */

html, body {
	width: 100%;
	height: 100%;
}
body {
	height: 100%;
	color: #000;
	font-size: 14px;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	line-height: 1.7;
	background: url(/img/bg.png);
}
a {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	color: #d20a0f;
	text-decoration: underline;
}
a:link{
	color: #d20a0f;
	text-decoration: underline;
}
a:visited{
	color: #d20a0f;
	text-decoration: underline;
}
a:hover{
	color: #d20a0f;
	text-decoration: underline;
}
a:focus {
	color: #000;
}
::selection {
	background: #d20a0f;
}

/* Style
============================================ */
.noPc { display: none; }
.noSp { display: block; }
.imgfix {
	width: 100%;
	height: auto;
}

#wrapper {
	background: url(/img/bg_frame.png) repeat-x;
}
.inner {
	margin: 0 auto;
	padding: 0 25px;
	width: 950px;
	position: relative;
}
header {
	height: 80px;
	background: url(/img/contents_header_bg.png);
}
header h1 {
	width: 252px;
	height: 47px;
	position: absolute;
	top: 13px;
	left: 0;
}
header .bnrArea {
	position: absolute;
	top: 12px;
	right: 0;
}
header #menu {
	display: none;
}
#menu_close, #open_menu
{ display: none; }

section {
	background: #efe5c5 url(/img/contents_bg.png) repeat-x left top;
}
.pagetop {
	margin: 30px 0 0 auto;
	width: 63px;
	cursor: pointer;
}
.ttl {
	float: left;
	margin: 0 0 20px 20px;
	padding: 20px 0;
	width: 230px;
	background: url(/img/line02.png) no-repeat left bottom;
}
.cttl {
	margin-bottom: 10px;
	padding: 10px 10px 20px;
	background: url(/img/cttl_line.png) no-repeat left bottom;
}
.sttl {
	font-size: 18px;
	font-weight: bold;
}
.main {
	float: right;
	height: auto;
	width: 600px;
}
.main h2 {
	margin-top: 30px;
	margin-bottom: 20px;
	padding: 0px 10px 20px;
	font-size: 18px;
	background: url(/img/line.png) no-repeat left bottom;
}
.blog .main .date {
	width: 510px;
	font-size: 12px;
	text-align: right;
}
.main .body:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.main .box {
	margin-bottom: 30px;
}
.main .floatR,
.main .floatL { width: 365px; }
.main .floatR.photo,
.main .floatL.photo { width: 220px; }
.main .box p { padding-top: 10px; }
.main .box .point { color: #d20a0f; }
.main .photo img {
	border:solid 3px #000;
	display: block;
	border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
}
.main img {
	margin-bottom: 10px;
	width: 100%;
}
.sub {
	margin-left: 20px;
	width: 200px;
	float: left;
}
.sub + .sub {
	margin-top: 20px;
	padding-top: 20px;
	background: url(/img/line02.png) no-repeat left top;
}
.sub a {
	padding: 2px 5px;
	display: block;
	background: url(/img/snav_off.png) no-repeat right center;
}
.sub a.cr,
.sub a:hover {
	background: url(/img/snav_on.png) no-repeat right center;
}
.block {
	padding: 10px 10px 15px;
	background: url(/img/line.png) no-repeat center bottom;
}
.blog .main div {
	margin-bottom: 100px;
}
.blog .main p + p {
	margin-top: 20px;
}

.blog .main img {
	width: auto;
	height: auto;
}
.blog .sub .block {
	padding: 10px 10px 40px;
}
.blog .sub .block li + li {
	margin-top: 20px;
}
.lead {
	position: absolute;
	top: 8px;
	right: -13px;
}
.headoffice.bld {
	position: absolute;
	top: 142px;
	left: 400px;
	transition: 0.1s;
}
.satellite.bld {
	position: absolute;
	top: 160px;
	left: 245px;
	transition: 0.1s;
}
.studio.bld {
	position: absolute;
	top: 182px;
	left: 609px;
	transition: 0.1s;
}
.headoffice.bld.hv {
	top: 136px;
}
.satellite.bld.hv {
	top: 154px;
}
.studio.bld.hv {
	top: 176px;
}
.headoffice.ttl {
	padding: 30px 139px 0 0;
	position: absolute;
	top: 130px;
	left: 404px;
}
.satellite.ttl {
	padding: 10px 80px 0 0;
	position: absolute;
	top: 141px;
	left: 251px;
}
.studio.ttl {
	padding: 0 80px 0 0;
	position: absolute;
	top: 147px;
	left: 616px;
}
.cloud {
	margin: 0 auto;
	width: 100%;
	height: 414px;
	background: url(/img/cloud01.png) no-repeat center center;
	position: relative;
	top: 51px;
	z-index: 100;
}
.above {
	top: 0;
	left: 0;
}
.middle {
	top: 0;
	left: 0;
	z-index: 500;
}
.below {
	top: 0;
	left: 0;
}
nav {
	margin: 0 auto;
	width: 1000px;
	position: static;
	top: 508px;
	text-align: center;
	background: url(/img/nav_bg.png) no-repeat 40px 29px;
}
nav li {
	height: 47px;
	float: right;
	position: relative;
	overflow: hidden;
}
nav li img {
	position: absolute;
	top: 0;
	left: 0;
}
nav li img:hover,
nav li img.on {
	top: -47px;
}
nav .top			{ width: 28px; margin-left: 61px; }
nav .onair		{ width: 57px; margin-left: 45px; }
nav .works		{ width: 63px; margin-left: 46px; }
nav .award		{ width: 74px; margin-left: 41px; }
nav .info			{ width: 72px; margin-left: 34px; }
nav .link			{ width: 40px; margin-left: 30px; }
nav .staff		{ width: 83px; margin-left: 31px; }
nav .company	{ width: 78px; margin-left: 41px; }
nav .recruit	{ width: 59px; margin-left: 36px; }
nav .contact	{ width: 78px; }
footer {
	height: 129px;
	background: url(/img/contents_footer_bg.png) repeat-x left top;
}
footer > img {
	display: none;
}
footer .copy {
	position: relative;
	top: 3px;
}

.gotop {
	width: 222px;
	height: 55px;
	position: absolute;
	top: 15px;
	right: 204px;
	overflow: hidden;
}
.btn {
	position: absolute;
	top: 0;
	left: 0;
}
.fuji {
	position: absolute;
	right: 0;
	bottom: -3px;
	transition: 0.1s;
}
.gotop:hover .fuji {
	bottom: 0;
}
.cloudTL {
	position: fixed;
	top: 52px;
	left: 0;
}
.cloudTR {
	position: fixed;
	top: 52px;
	right: 0;
}
.cloudBL {
	position: fixed;
	top: 605px;
	left: 0;
}

@media screen and (max-width: 768px) {
	header #menu
		{ display: block; }
	.noPc { display: block; }
	.noSp { display: none !important; }

	body {
		background-size: 65px 13px;
		height: 100%;
	}
	#wrapper {
		background: none;
		height: 100%;
	}
	.inner {
		padding: 0;
		width: 100%;
	}
	header {
		padding-bottom: 14px;
		width: 100%;
		height: 40px;
		background: url(/img/sp/head_bg.png) repeat-x center bottom;
		position: fixed;
		top:0;
		left:0;
		z-index: 20000;
	}
	header h1 {
		width: 155px;
		height: 29px;
		position: absolute;
		top: 0;
		left: 8px;
	}
	header article {
		background:url("../images/head_bg.png");
		position: relative;
	}
	header article a img:first-child {
		width: 51%;
	}
	header article>img:nth-child(2) {
		width: 34%;
	}
	header #menu {
		width: 13%;
		position: absolute;
		top:0;
		right:1%;
	}
	header #menu_close {
		width: 13%;
		position: absolute;
		top:0;
		right:1%;
	}
	.ttl {
		margin: 0;
		padding: 0;
		background: none;
		text-align: center;
	}
	.ttl h1 {
		height: 68px;
	}
	.ttl img {
		zoom: 50%;
	}

	.bnrArea {
		display: none;
	}
	#open_menu {
		width: 100%;
		position: relative;
		top:0;
		left:0;
		z-index: 15000;
	}
	#open_menu section {
		width: 100%;
		padding: 0 0 20px;
		background: #EAB961;
	}
	#open_menu section img {
		width: 100%;
	}

	.main, .sub, .ttl {
		width: auto;
		float: none;
	}

	section {
		padding-top: 70px;
		width: 100%;
		height: auto;
		background: #f0e5c5 url(/img/sp/bg.png) no-repeat center top;
		background-size: 370px 475px;
	}
	section.blog {
		padding: 80px 0 100px 0
	}
	section.walk {
		height: 80%;
	}
	section h1 {
		width: 313px;
		height: 88px;
		margin: auto;
		position: static;
	}
	.blog .main .date {
		width: auto;
	}
	.main .body {
		padding: 0 10px;
	}
	.main .body + .body {
		margin-top: 60px;
	}
	.main .body h2 {
		padding: 0 0 20px;
		font-size: 22px;
	}
	.main .body img {
		zoom: 50%;
	}
	.sub {
		margin-left: 0;
	}
	.blog .sub .block {
		padding: 0;
	}
	.blog .sub .block + .block {
		margin-top: 20px;
	}
	.block li {
		margin-bottom: 2px;
		width: 100%;
		float: none;
		text-align: right;
		background: #f9f2da;
	}
	.blog .sub .block li + li {
		margin-top: 0;
	}
	.block li a {
		padding: 20px;
		display: block;
		background: none;
		color: #000;
		font-size: 16px;
	}
	.spCont {
		margin: auto;
		width: 320px;
		position: relative;
	}
	.spCont .lead {
		margin: -20px auto 0;
		width: 156px;
		position: static;
	}
	.headoffice.ttl {
		padding: 0 0 74px 81px;
		position: absolute;
		top: 162px;
		left: 102px;
	}
	.satellite.ttl {
		padding: 0 0 37px 49px;
		position: absolute;
		top: 185px;
		left: 14px;
	}
	.studio.ttl {
		padding: 0 0 19px 46px;
		position: absolute;
		top: 179px;
		left: 233px;
	}
	.pagetop {
		margin: 30px 0;
		width: 100%;
		text-align: center;
	}
	footer {
		margin-top: -80px;
		height: 28px;
		background: none;
		text-align: center;
	}
	footer > img {
		width: 100%;
		display: block;
	}
	footer nav {
		display: none;
	}
	footer .copy {
		padding: 10px 0;
		background: url(/img/sp/footer_bg.png) repeat-x;
	}

	.gotop,
	.cloudTL,
	.cloudTR,
	.cloudBL {
		display: none;
	}
}