@charset "UTF-8";

@media all and (min-width: 921px) {
#top-navigation {
	width: 920px;
	margin: 35px auto 0 auto;
	overflow: hidden;
}
}
@media all and (min-width: 870px) and (max-width: 920px) {
#top-navigation {
	width: 850px;
	margin: 35px auto 0 auto;
	overflow: hidden;
}
ul.menu li {
	float: left;
	margin:0 15px;
}
}
@media all and (max-width: 869px) {

}

@media all and (min-width: 870px) {

.wrapper {}

p {
	letter-spacing: 0.1em;
	line-height: 2.1em;
}

h1 {
	position: absolute;
	top:50%;
	left:50%;
}
h1 .pc {
	position: absolute;
	top:-234px;
	left:-211px;
	display: block;
	background:url(../images/logo_anim.png) no-repeat;
	width:422px;
	height:468px;
	overflow: hidden;
	text-indent: -9999px;
}
#header {
	position: relative;
	background-color: #D9EBF0;
}
#header .visual {
	position: relative;
	padding-top: 66.428571%;
	opacity: 0;
}
#header .visual li {
	position: absolute;
	top:0px;
	left:0px;
	width:100%;
}
#header .nav {
	position: absolute;
	left:0px;
	bottom:16px;
	width:100%;
	text-align: center;
}
#header .nav li {
	display: inline-block;
	margin:0 12px;
}
#header_menu {
	position: absolute;
	top:0px;
	left: 0px;
	width: 100%;
	margin:0;
}
/*#top-navigation {
	width: 920px;
	margin: 35px auto 0 auto;
	overflow: hidden;
}*/

.section {
	width:860px;
	margin: 0 auto 200px auto;
	overflow: hidden;
}
.section .left_column {
	float:left;
	width:275px;
}
.section .right_column {
	float:left;
	width:585px;
}

#philosophy {
	width:860px;
	margin:85px auto 200px auto;
}
#philosophy .t_img {
	background-repeat: no-repeat;
	background-size: 100% 100%;
	overflow: hidden;
	text-indent: -9999px;
}
#philosophy .fade_anim {
	opacity: 0;
}
#philosophy h2 {
	width:575px;
	height:40px;
	background-image: url(../images/top/catch01.png);
	margin-bottom:63px;
}
#philosophy .txt01 {
	width:231px;
	height:17px;
	background-image: url(../images/top/catch02.png);
	margin-bottom:33px;
}
#philosophy .txt02 {
	width:457px;
	height:17px;
	background-image: url(../images/top/catch03.png);
	margin-bottom:33px;
}
#philosophy .txt03 {
	width:331px;
	height:17px;
	background-image: url(../images/top/catch04.png);
	margin-bottom:33px;
}
#philosophy .txt04 {
	width:335px;
	height:17px;
	background-image: url(../images/top/catch05.png);
	margin-bottom:33px;
}
#philosophy .txt05 {
	width:350px;
	height:17px;
	background-image: url(../images/top/catch06.png);
	margin-bottom:33px;
}
#philosophy .txt06 {
	width:505px;
	height:17px;
	background-image: url(../images/top/catch07.png);
	margin-bottom:33px;
}
#philosophy .txt07 {
	width:415px;
	height:17px;
	background-image: url(../images/top/catch08.png);
	margin-bottom:84px;
}
#philosophy .txt08 {
	width:267px;
	height:17px;
	background-image: url(../images/top/catch09.png);
	margin-bottom:33px;
}
#philosophy .txt09 {
	width:522px;
	height:17px;
	background-image: url(../images/top/catch10.png);
	margin-bottom:33px;
}
#philosophy .txt10 {
	width:391px;
	height:17px;
	background-image: url(../images/top/catch11.png);
	margin-bottom:33px;
}
#philosophy .txt11 {
	width:517px;
	height:17px;
	background-image: url(../images/top/catch12.png);
	margin-bottom:33px;
}
#philosophy .txt12 {
	width:531px;
	height:17px;
	background-image: url(../images/top/catch13.png);
	margin-bottom:33px;
}
#philosophy .txt13 {
	width:299px;
	height:17px;
	background-image: url(../images/top/catch14.png);
	margin-bottom:33px;
}
#philosophy .txt14 {
	width:352px;
	height:17px;
	background-image: url(../images/top/catch15.png);
	margin-bottom:55px;
}
#philosophy .att {
	font-size:12px;
	color:#999;
	line-height: 1.7em;
	letter-spacing: 0.1em;
}

#works {}
#works .left_column {}
#works .right_column {}
#works .left_column h3 {
	text-indent: -9999px;
	overflow: 9999px;
	background: url(../images/top/title_works.png) no-repeat;
	background-size:100% 100%;
	width:152px;
	height:72px;
	margin:0 0 34px 0;
}
#works .left_column .link a {
	display: block;
	text-indent: -9999px;
	overflow: 9999px;
	background: url(../images/top/btn_more.png) no-repeat;
	background-size:100% 100%;
	width:85px;
	height:15px;
}
#works .right_column {}
#works .right_column .thumb {
	margin:0 0 20px 0;
	width:585px;
}
#works .right_column .thumb img {
	width:100%;
	height: auto;
}
#works .right_column .copy {
	margin: 0 0 10px 0;
}
#works .right_column .copy .ttl {
	font-size:10px;
	line-height: 1em;
}
#works .right_column h4 {
	font-size:22px;
	letter-spacing: 0.1em;
	line-height: 1.7em;
	/*font-weight: bold;*/
	color:#888;
}
#works .right_column .sep {
	line-height: 0em;
	margin: 0 0 14px 0;
}
#works .right_column .tags {
	font-size: 14px;
	letter-spacing: 0.1em;
	margin:0;
}
#works .right_column .tags a {
	color:#007292;
	line-height: 1.7em;
	padding:5px 10px 5px 18px;
	margin:0 4px 0 0;
	background:url(../images/common/icon_tag.png) no-repeat left center;
	background-size: 14px 14px;
}
#works .right_column .tags a:hover {
	color:#73a3b0;
	text-decoration: none;
}
#works .right_column .crient {
	margin: 0 0 10px 0;
}
#works .right_column .crient .ttl {
	font-size: 10px;
	line-height: 1em;
	margin: 0 0 5px 0;
}
#works .right_column .crient .txt {
	color:#999;
	line-height: 1.7em;
	font-size: 12px;
	letter-spacing: 0.1em;
}
#works .right_column .txt {
	margin:0 0 15px 0; 
}
#works .right_column .detail {
	margin: 0 0 15px 0;
}
#works .right_column .detail,
#works .right_column .detail p {
	color:#999;
	line-height: 1.7em;
	font-size: 14px;
	letter-spacing: 0.1em;
}

#days {
	margin-bottom:190px;
}
#days .left_column {}
#days .right_column {}
#days .left_column h3 {
	text-indent: -9999px;
	overflow: hidden;
	background: url(../images/top/title_days.png) no-repeat;
	background-size:100% 100%;
	width:97px;
	height:28px;
	margin:0 0 34px 0;
}
#days .left_column .link a {
	display: block;
	text-indent: -9999px;
	overflow: 9999px;
	background: url(../images/top/btn_more.png) no-repeat;
	background-size:100% 100%;
	width:85px;
	height:15px;
}
#days .right_column {}
#days .right_column .thumb {
	margin:0 0 15px 0;
	/*box-sizing:border-box;
	border:solid 2px #bfdce4;*/
}
#days .right_column .thumb img {
	width:100%;
	height: auto;
}
#days .right_column .date {
	color:#999;
	font-size:14px;
	letter-spacing: 0.1em;
	margin-bottom:15px;
}
#days .right_column .copy {}
#days .right_column h4 {
	font-size:22px;
	letter-spacing: 0.1em;
	line-height: 1.7em;
	color:#888;
	margin-bottom:20px;
	/*font-weight: bold;*/
}
#days .right_column .txt {
	margin-bottom: 15px;
}
#days .right_column .txt,
#days .right_column .txt p {
	color:#999;
	line-height: 2.2em;
	font-size: 16px;
	letter-spacing: 0.1em;
}
#days .right_column .tags {
	font-size: 14px;
	letter-spacing: 0.1em;
	margin:0;
}
#days .right_column .tags a {
	color:#007292;
	line-height: 1.7em;
	padding:5px 10px 5px 18px;
	margin:0 4px 0 0;
	background:url(../images/common/icon_tag.png) no-repeat left center;
	background-size: 14px 14px;
}
#days .right_column .tags a:hover {
	color:#73a3b0;
	text-decoration: none;
}

#about {}
#about .left_column {}
#about .left_column h3 {
	text-indent: -9999px;
	overflow: hidden;
	background: url(../images/top/title_about.png) no-repeat;
	background-size:100% 100%;
	width:128px;
	height:27px;
	margin:0;
}
#about .right_column {}
#about .right_column p {
	font-size: 18px;
	color:#007292;
	line-height: 2.7em;
}

#mission {}
#mission .left_column {}
#mission .left_column h3 {
	text-indent: -9999px;
	overflow:hidden;
	background: url(../images/top/title_mission.png) no-repeat;
	background-size:100% 100%;
	width:154px;
	height:27px;
}
#mission .right_column {}
#mission .right_column ul {}
#mission .right_column ul li {
	background:url(../images/top/point_mission.png) no-repeat left center;
	background-size:11px 11px;
	color:#007292;
	font-size:16px;
	line-height: 1em;
	padding:0 0 0 20px;
	margin:0 0 32px 0;
}
#mission .right_column p.att {
	color:#999;
	font-size:16px;
}

#founder {}
#founder .left_column {}
#founder .left_column h3 {
	text-indent: -9999px;
	overflow:hidden;
	background: url(../images/top/title_founder.png) no-repeat;
	background-size:100% 100%;
	width:180px;
	height:69px;
	margin:15px 0 0 0;
}
#founder .right_column p {
	font-size:16px;
	line-height: 2.8em;
}



#company {
	margin-bottom:85px;
}
#company h3 {
	width:182px;
	height:69px;
	margin:10px 0 0 0;
	background:url(../images/top/title_company.png) no-repeat;
	background-size:100% 100%;
	overflow: hidden;
	text-indent: -9999px;
}
#company .right_column {}
#company .right_column dl {}
#company .right_column dl dt {
	color:#999;
	font-size:14px;
	float:left;
	line-height: 2.7em;
}
#company .right_column dl dd {
	font-size:14px;
	color:#007292;
	margin-left:230px;
	line-height: 2.9em;
}

}


/******************************************************************************************
******************************************************************************************/


@media all and (max-width: 869px) {

.section {
	margin-bottom:20%;
}
.section .left_column {
}
.section .left_column .link {}
.section .left_column .link a {
	display: block;
	width:13.281%;
	padding-top: 2.344%;
	line-height: 0em;
	background:url(../images/top/btn_more.png) no-repeat;
	background-size:100% 100%;
	margin:3% 0 6% 5.075%;
	overflow: hidden;
	text-indent: -9999px;
}
.section .right_column {}

.wrapper {}

p {
	letter-spacing: 0.1em;
	line-height: 2.1em;
}

h1 {
	position: absolute;
	top:0px;
	left:0px;
	width:100%;
	height: 100%;
}
h1 .sp {
	display: block;
	width:23%;
	margin:18% auto 0 auto;
}
#header {
	position: relative;
	background-color: #D9EBF0;
}
#header .visual {
	position: relative;
	padding-top: 66.428571%;
	opacity: 0;
}
#header .visual li {
	position: absolute;
	top:0px;
	left:0px;
	width:100%;
}
#header .nav {
	position: absolute;
	left:0px;
	bottom:16px;
	width:100%;
	text-align: center;
}
#header .nav li {
	display: inline-block;
	margin:0 12px;
}

#philosophy {}
#philosophy .t_img {
	background-repeat: no-repeat;
	background-size: 100% 100%;
	overflow: hidden;
	text-indent: -9999px;
	line-height: 0em;
}
#philosophy .fade_anim {
	opacity: 0;
}
#philosophy h2 {
	width:89.85%;
	padding-top:6.172%;
	background-image: url(../images/top/catch01.png);
	background-size: 100% 100%;
	margin-top:12%;
	margin-bottom:9.844%;
	margin-left:5.075%;
}
#philosophy .txt01 {
	width:36.09375%;
	padding-top:2.656%;
	background-image: url(../images/top/catch02.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt02 {
	width:71.406%;
	padding-top:2.656%;
	background-image: url(../images/top/catch03.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt03 {
	width:52.344%;
	padding-top:2.656%;
	background-image: url(../images/top/catch04.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt04 {
	width:52.344%;
	padding-top:2.656%;
	background-image: url(../images/top/catch05.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt05 {
	width:54.688%;
	padding-top:2.656%;
	background-image: url(../images/top/catch06.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt06 {
	width:78.906%;
	padding-top:2.656%;
	background-image: url(../images/top/catch07.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt07 {
	width:64.844%;
	padding-top:2.656%;
	background-image: url(../images/top/catch08.png);
	margin-bottom:13.125%;
	margin-left:5.075%;
}
#philosophy .txt08 {
	width:41.719%;
	padding-top:2.656%;
	background-image: url(../images/top/catch09.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt09 {
	width:81.563%;
	padding-top:2.656%;
	background-image: url(../images/top/catch10.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt10 {
	width:61.094%;
	padding-top:2.656%;
	background-image: url(../images/top/catch11.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt11 {
	width:80.781%;
	padding-top:2.656%;
	background-image: url(../images/top/catch12.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt12 {
	width:82.969%;
	padding-top:2.656%;
	background-image: url(../images/top/catch13.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt13 {
	width:46.719%;
	padding-top:2.656%;
	background-image: url(../images/top/catch14.png);
	margin-bottom:5.156%;
	margin-left:5.075%;
}
#philosophy .txt14 {
	width:55%;
	padding-top:2.656%;
	background-image: url(../images/top/catch15.png);
	margin-bottom:55px;
	margin-left:5.075%;
}
#philosophy .att {
	font-size:12px;
	color:#999;
	line-height: 1.7em;
	letter-spacing: 0.1em;
	margin:0 5.075% 0 5.075%;
}

#works {}
#works .left_column {}
#works .left_column h3 {
	line-height: 0em;
	width:68.203%;
	padding-top:5.7813%;
	background: url(../images/top/title_works_sp.png) no-repeat;
	background-size:100% 100%;
	margin:0 0 0 5.075%;
	overflow: hidden;
	text-indent: -9999px;	
}
#works .left_column .link {}
#works .right_column {}
#works .right_column .work {}
#works .right_column .work .thumb {
	margin:0 0 3% 0;
}
#works .right_column .work .thumb img {
	width:100%;
	height: auto;
}
#works .right_column .work .copy,
#works .right_column .work .sep,
#works .right_column .work .crient,
#works .right_column .work .detail,
#works .right_column .work .tags {
	margin-left:5.075%;
}
#works .right_column .copy .ttl {
	font-size:10px;
	line-height: 1em;
}
#works .right_column h4 {
	font-size:22px;
	letter-spacing: 0.1em;
	line-height: 1.7em;
	/*font-weight: bold;*/
	color:#888;
}
#works .right_column .sep {
	line-height: 0em;
	margin: 0 0 20px 0;
}
#works .right_column .tags {
	font-size: 14px;
	letter-spacing: 0.1em;
	margin:0;
}
#works .right_column .tags a {
	color:#007292;
	line-height: 1.7em;
	padding:5px 10px 5px 18px;
	margin:0 4px 0 0;
	background:url(../images/common/icon_tag.png) no-repeat left center;
	background-size: 14px 14px;
}
#works .right_column .tags a:hover {
	color:#73a3b0;
	text-decoration: none;
}
#works .right_column .crient {
	margin: 0 0 10px 0;
}
#works .right_column .crient .ttl {
	font-size: 10px;
	line-height: 1em;
	margin: 0 0 5px 0;
}
#works .right_column .crient .txt {
	color:#999;
	line-height: 1.7em;
	font-size: 12px;
	letter-spacing: 0.1em;
}
#works .right_column .txt {
	margin:0 0 15px 0; 
}
#works .right_column .detail {
	margin: 0 0 15px 0;
}
#works .right_column .detail,
#works .right_column .detail p {
	color:#999;
	line-height: 1.7em;
	font-size: 14px;
	letter-spacing: 0.1em;
}

#days {}
#days .left_column {}
#days .left_column h3 {
	line-height: 0em;
	width:20.859%;
	padding-top:5.7813%;
	background: url(../images/top/title_days_sp.png) no-repeat;
	background-size:100% 100%;
	margin:0 0 0 5.075%;
	overflow: hidden;
	text-indent: -9999px;	
}
#days .right_column {}
#days .right_column .work {}
#days .right_column .work .thumb {
	/*border-top:2px solid #c2e4eb;
	border-bottom:2px solid #c2e4eb;*/
	margin:0 0 3% 0;
}
#days .right_column .work .thumb img {
	width:100%;
	height: auto;
}
#days .right_column .work h4,
#days .right_column .work .date,
#days .right_column .work .tags {
	margin-left:5.075%;
}
#days .right_column .date {
	color:#999;
	font-size:14px;
	letter-spacing: 0.1em;
	margin-bottom:15px;
}
#days .right_column .copy {}
#days .right_column h4 {
	font-size:22px;
	letter-spacing: 0.1em;
	line-height: 1.7em;
	color:#888;
	margin-bottom:20px;
}
#days .right_column .txt {
	margin-bottom: 15px;
}
#days .right_column .txt,
#days .right_column .txt p {
	color:#999;
	line-height: 2.2em;
	font-size: 16px;
	letter-spacing: 0.1em;
}
#days .right_column .tags {
	font-size: 14px;
	letter-spacing: 0.1em;
	margin:0;
}
#days .right_column .tags a {
	color:#007292;
	line-height: 1.7em;
	padding:5px 10px 5px 18px;
	margin:0 4px 0 0;
	background:url(../images/common/icon_tag.png) no-repeat left center;
	background-size: 14px 14px;
}
#days .right_column .tags a:hover {
	color:#73a3b0;
	text-decoration: none;
}


#about {}
#about .left_column {}
#about .left_column h3 {
	line-height: 0em;
	width:29.219%;
	padding-top:5.7813%;
	background: url(../images/top/title_about_sp.png) no-repeat;
	background-size:100% 100%;
	margin:0 0 6% 5.075%;
	overflow: hidden;
	text-indent: -9999px;	
}
#about .right_column {
	margin:0 5.075%;
}

#mission {

}
#mission .left_column {}
#mission .left_column h3 {
	line-height: 0em;
	width:35.5469%;
	padding-top:5.7813%;
	background: url(../images/top/title_mission_sp.png) no-repeat;
	background-size:100% 100%;
	margin:0 0 6% 5.075%;
	overflow: hidden;
	text-indent: -9999px;	
}
#mission .right_column {
	margin:0 5.075%;
}
#mission .right_column ul {}
#mission .right_column ul li {
	background:url(../images/top/point_mission.png) no-repeat left center;
	background-size:11px 11px;
	color:#007292;
	font-size:14px;
	line-height: 1em;
	letter-spacing: 0.1em;
	padding:0 0 0 20px;
	margin:0 0 3.6% 0;
}
#mission .right_column p.att {
	color:#999;
	font-size:14px;
}

#founder {}
#founder .left_column {}
#founder .left_column h3 {
	line-height: 0em;
	width:40.469%;
	padding-top:13.906%;
	background: url(../images/top/title_founder_sp.png) no-repeat;
	background-size:100% 100%;
	margin:0 0 6% 5.075%;
	overflow: hidden;
	text-indent: -9999px;	
}
#founder .right_column {
	margin:0 5.075%;
}
#founder .right_column p {
	font-size:14px;
	line-height: 2.2em;
}


#company {}
#company .left_column {}
#company .left_column h3 {
	line-height: 0em;
	width:42.422%;
	padding-top:13.906%;
	background: url(../images/top/title_company_sp.png) no-repeat;
	background-size:100% 100%;
	margin:0 0 6% 5.075%;
	overflow: hidden;
	text-indent: -9999px;	
}
#company .right_column {
	margin:0 5.075%;
}
#company .right_column dl {}
#company .right_column dl dt {
	color:#999;
	font-size:14px;
	float:left;
	line-height: 2.2em;
	width: 50%;
}
#company .right_column dl dd {
	font-size:14px;
	color:#007292;
	margin-left:50%;
	line-height: 2.2em;
	width: 50%;
}

}