@charset "utf-8";



/* ----------------------------------------------------------
common_element
----------------------------------------------------------- */

a{ 
	color: #000000;
	text-decoration: none; 
}

a:hover{ 
	text-decoration: underline; 
}

a.underline{ 
	text-decoration: underline; 
}

a.underline:hover{ 
	text-decoration: none;
 }
 
.undernone{
	text-decoration: none;
}

.undernone:hover{
	text-decoration: none !important;
}
 
.imghover{
	cursor: pointer;
}

.imgchange{
	cursor: pointer;	
}

input[type="button"],input[type="image"]{
	 cursor: pointer; 
}

a.tel{
	cursor: default;
	color: #000000;	
}

body{
	font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 12px;
	color: #000000;
	background: #ffffff;
}

.all_wrap{
	position: relative;
	overflow: hidden;
}

.contents_wrap{
	position: relative;
	overflow: hidden;
	min-height: 100%;
	z-index: 2;	
}

.gecko img,.gecko input[type="image"]{
	background: rgba(255, 255, 255, 0.01);	
}

input[type="submit"]{
	cursor: pointer;	
}

.loading{
	z-index: 20000;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 200%;
	background: #ffffff;
}

.scroll_image{
	height: 500px;	
}

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

header{
	background: #000000;
	overflow: hidden;
	position: relative;	
}

header .header_in{
	position: relative;
	overflow: hidden;
	z-index: 2;
	min-height: 530px;
}

header .header_in h1{
	position: absolute;
	top: 30%;
	left: 50%;
	margin: -53px 0 0 -316px;
	width: 632px;
	height: 106px;
}

header .header_in .movie{
	position: absolute;
	left: 50%;
	top: 40%;
	margin: 0 0 0 -256px;
	cursor: pointer;
}
header .header_in .movie .movieImg{
	position: relative;
}
header .header_in .movie .playr .play{
	position: absolute;
	z-index:4;
}
header .header_in .movie .playr ifream{
	position: absolute;
	opacity:0;
	outline:none;
	border:none;
}


header .header_in .scroll{
	position: absolute;
	left: 50%;
	bottom: 90px;
	margin: 0 0 0 -50px;
	cursor: pointer;
}

header .header_in .open{
	position: absolute;
	right: 80px;
	bottom: 90px;
	margin: 0 0 0 -50px;
	cursor: pointer;
	background-color: #ffffff;
}

header .video{
	overflow: hidden;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0%;
	width: 100%;
	height: 100%;
}

header .video_in{
		
}

header .header_in .since{
	position: absolute;
	top: 53px;
	right: 80px;
}

.contents_wrap{
	z-index: 4;	
}

.backimage_wrap{
	width: 100%;
	top: 0;
	left: 0;		
}

.backimage_wrap_in{
	position: relative;
	overflow: hidden;
}

.backimage{
	position: fixed;
	overflow: hidden;
	z-index: 1;
	top: 0;
	left: 0%;
	width: 100%;
}

#backimage01{
	z-index: 3;	
}

#backimage02{
	z-index: 2;	
}

#backimage03{
	z-index: 1;	
}

.backimage.visible{
	display: block !important;
}

.backimage .backimage_in{
		
}

#backimage01{
		
}

/*
----------------- .scroll_wrap ---------------------
*/

.scroll_wrap{
	display: table;
	width: 100%;
	min-height: 410px;
	background: #000000;
}

.scroll_wrap#scroll04{
	min-height: 610px;	
}

.scroll_wrap_in{
	display: table-cell;
	text-align: center;
	vertical-align: middle;	
}

.scroll_wrap_in .title{
	margin: 0 0 63px 0;
}

.scroll_wrap_in p.text{
	color: #ffffff;
	letter-spacing: 0.3em;
	font-size: 120%;
	line-height: 40px;
}

.scroll_wrap_in .btn_area{
	width: 470px;
	margin: 25px auto 0 auto;
}

.scroll_wrap_in .btn_area .btn{
	display: table;
	width: 100%;
	height: 63px;
	margin: 25px 0 0 0;
	background: #ffffff;
}

.scroll_wrap_in .btn_area .btn a{
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	letter-spacing: 0.2em;
}

.scroll_wrap_in .btn_area .btn.type01 a{
	background-color: #cdb99a;
}

.scroll_wrap_in .btn_area .btn.type01:hover a{
	background-color: #d9cab3;
}

.scroll_wrap_in .btn_area .btn.type02 a{
	background-color: #cdccc7;
}

.scroll_wrap_in .btn_area .btn.type02:hover a{
	background-color: #d9d9d5;
}


.scroll_wrap_in .btn_area .btn a span{
	display: inline-block;
	height: 13px;
	line-height: 13px;
	padding: 0 0 0 24px;
	background-image: url(../img/btn_bg.png);
	background-repeat: no-repeat;
	background-position: left;
}

/*
----------------- .company_info ---------------------
*/

.company_info{
	text-align: center;
	background: #ececec;
	color: #2b3341;
}

.company_info .company_info_in{
	padding: 150px 20px 80px 20px;
}

.company_info .title{
	margin: 0 0 22px 0;
}

.company_info .lead{
	font-size: 134%;
	letter-spacing: 0.3em;
	margin: 0 0 70px 0;		
}

.company_info .profile{
	border-top: 1px solid #ffffff;
}

.company_info .profile_in{
	padding: 24px 0;
	border-bottom: 1px solid #ffffff;
}

.company_info .profile_in p{
	font-size: 100%;
	letter-spacing: 0.1em;
}

.company_info .profile_in .map{
	margin: 24px auto;
	min-width: 800px;
	max-width: 1322px;
}

.company_info .profile_in .map img{
	width: 100%;
	height: auto;
}

.company_info .profile_in dl dt{
	font-size: 100%;
	letter-spacing: 0.1em;
	line-height: 22px;
}

.company_info .profile_in dl dd{
	font-size: 100%;
	letter-spacing: 0.1em;
	line-height: 22px;
}

.company_info .profile_in dl dd span.tel{
	display: inline-block;
	line-height: 16px;
	padding: 0 0 0 27px;
	background: url(../img/icon_tel.png) no-repeat;	
}

.map_wrap{
	position: relative;
	/*height: 570px;*/
}

/*
.map_wrap_in{
	position: absolute;
	top: 0;
	left: 50%;
	margin: 0 0 0 -661px;
	margin: 0 auto;
	width: 1322px;
}*/

.map_wrap_in{
	display: table;
	width: 100%;
	max-width:1322px;
	margin: 0 auto;
}

.map_in{
	display: table-cell;
	width: 50%;
	text-align: center;	
}

/*
.map_in{
	width: 648px;	
}*/

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

footer{
	display: table;
	width: 100%;
	height: 228px;
	background: #000000;	
}

.footer_in{
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

.footer_in .copyright{
	margin: 19px 0 0 0;	
}

.icon_block{
	position: fixed;
	z-index: 900;
	right: 0;	
	top: 100px;
}

.icon_block .icon_url{
	margin: 0 0 7px 0;	
}

.icon_block .icon_top{
	text-align: right;
}


/* 20150309　追記
===========================================================*/
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700);

/* ----------------------------------------------------------
common_element
----------------------------------------------------------- */
body{
	font-family:YuGothic,'游ゴシック',"Lucida Grande","Lucida Sans Unicode","Hiragino Kaku Gothic Pro","メイリオ","ヒラギノ角ゴ Pro W3",Meiryo,"ＭＳ Ｐゴシック",Helvetica,Arial,Verdana,sans-serif;
}

a img {
    -webkit-transition: 0.3s ease-in-out;  
       -moz-transition: 0.3s ease-in-out;  
         -o-transition: 0.3s ease-in-out;  
            transition: 0.3s ease-in-out;  
}

a:hover img {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}

.fixed_nav_wrap h1 a:hover img {
    opacity: 1.0;
    filter: alpha(opacity=100);
    -moz-opacity: 1.0;
    opacity: 1.0;
}

.f_roboto {
	font-family: 'Roboto Condensed', sans-serif;
}

.nav a {
	text-decoration: none;
	padding: 10px 0;
	display: block;
}

.nav a:after {
    display: block;
    content: "";
    width: 0%;
    height: 3px;
    background-color: #2b3341;
    margin: 3px auto 0;
    transition: .15s ease-out;
    -webkit-transition: .15s ease-out;
    -moz-transition: .15s ease-out;
    -o-transition: .15s ease-out;
    -ms-transition: .15s ease-out;
}

.nav a:hover:after {
    width: 100%;
}

.scroll_wrap_in .title {
	font-family: 'Roboto Condensed', sans-serif;
	color: #656565;
    margin: 0 0 55px 0;
}

.scroll_wrap_in p.text {
	font-size: 142%;
}

.catch {
	height: 415px;
	width: 100%;
	padding-top: 105px;
	background-size: cover !important;
}

.main {
	background-color: #f2f2f2;
	padding: 70px 0 115px;
}

#top .main {
	background-color: transparent;
    padding: 0;
}

.title {
	font-size: 275%;
	text-align: center;
	letter-spacing: 0.2em;
	font-family: 'Roboto Condensed', sans-serif;
}


/*
-------------------------- header -----------------------------
*/
#fixed_nav {
	position: fixed;
    background-color: #fff;
    width: 100%;
    z-index: 100;
}

.fixed_nav_wrap {
    height: 105px;
    max-width: 1240px;
    margin: 0 auto;
    position: relative;
    padding: 0 20px;
}

.fixed_nav_wrap h1 {
	position: absolute;
	left: 20px;
	top: 45px;
}

#about .nav01 a:after,
#history .nav02 a:after,
#access .nav03 a:after,
#works .nav04 a:after,
#contact .nav05 a:after {
    width: 100%;
}

.fixed_nav_wrap .nav {
	font-family: 'Roboto Condensed', sans-serif;
	position: absolute;
	right: 20px;
	top: 35px;
}

.fixed_nav_wrap  .nav li {
	display: table-cell;
	padding: 0 0 0 60px;
	line-height: 18px;
}


/*
-------------------------- index_header -----------------------------
*/
header .header_in h1{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -53px 0 0 -316px;
	width: 632px;
	height: 106px;
}

header .header_in .movie_catch {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -53px 0 0 -316px;
	width: 632px;
	height: 106px;
}

header .header_in .since{
	position: absolute;
	top: 155px;
	right: 80px;
}


/*
----------------- .scroll_wrap ---------------------
*/
.scroll_wrap{
	display: table;
	width: 100%;
	min-height: 520px;
	background: #000000;
}


/*
----------------- .company_info ---------------------
*/
.company_info{
	text-align: center;
	background: #f2f2f2;
	color: #2b3341;
}

.company_info .company_info_in{
	padding: 0 20px;
}

.company_info .profile{
	border-top: 1px solid #ffffff;
    max-width: 1000px;
    margin: 0 auto;
}

.company_info .profile_in{
	padding: 30px 0;
	border-bottom: 1px solid #ffffff;
	font-size: 117%;
}

.company_info .profile_in.last {
	padding-bottom: 0;
	border-bottom: none;
}

.company_info .profile_in .map{
	margin: 18px auto 0;
	min-width: 50%;
	max-width: 1000px;
}

.company_info .profile_in dl dt{
	font-size: 100%;
	letter-spacing: 0.1em;
	line-height: 22px;
	margin-bottom: 10px;
}

.company_info .profile_in dl dd span.tel{
	display: inline-block;
	line-height: 16px;
	padding: 0 0 0 27px;
	background: url(../img/icon_tel.png) no-repeat;
	margin-bottom: 10px;
}

.map_wrap{
	position: relative;
	/*height: 570px;*/
}

.map_wrap_in{
	display: table;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}

.map_in{
	display: table-cell;
	width: 50%;
	text-align: center;	
}


/*
------------------- footer -----------------------
*/
.scroll_wrap#scroll04,
.scroll_wrap.bottom_contents {
	min-height: 900px;
}

.scroll_wrap.bottom_contents .scroll_wrap_in .title {
    margin: 0 0 35px 0;
}

.scroll_wrap.bottom_contents .text {
	margin-bottom: 70px;
}

.scroll_wrap_in .link_area {
    width: 740px;
	margin: 0 auto;
}

.btn_works {
	position: relative;
	width: 740px;
	height: 210px;
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	margin-bottom: 35px;
	background-color: #fff;
}

.btn_works p {
	position: relative;
	z-index: 10;
	text-align: center;
	width: 240px;
}

.btn_works a {
	display: block;
}

.btn_works p span {
	font-size: 200%;
	display: block;
    z-index: 10;
	margin-bottom: 10px;
}

.btn_works img {
	position: absolute;
	left: 0;
	top: 0;
}

.btn_works a:hover {
	text-decoration: none;
}

.btn_contact {
	margin-top: 35px;
	border: 4px solid #fff;
	text-align: left;
	font-family: 'Roboto Condensed', sans-serif;
}

.btn_contact a {
	color: #fff;
	padding: 40px 0;
	display: block;
}

.btn_contact div {
	background: url(../img/cmn_cotact_arrow.png) 0 50% no-repeat;
	height: 52px;
	width: 535px;
	margin: 0 auto 25px;
	font-size: 200%;
	position: relative;
}

.btn_contact span img {
	position: absolute;
	right: 0;
	top: 0;
}

.btn_contact a:hover {
	text-decoration: none;
}

.btn_contact a:hover img {
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
}

.btn_contact div p {
	background: url(../img/cmn_cotact_on.png) 100% 0 no-repeat;
}

.btn_contact div p span {
	background-color: #000;
	line-height: 52px;
	padding-right: 15px;
}

.btn_contact ul {
	width: 535px;
	margin: 0 auto;
	overflow: hidden;
}

.btn_contact ul li {
	float: left;
	width: 255px;
}

.btn_contact ul li:first-child {
	margin-right: 25px;
}

.btn_contact ul li p {
	font-size: 208%;
	padding-left: 27px;
	background: url(../img/icon_phone.png) 0 50% no-repeat;
	min-height: 19px;
    height: inherit;
    margin: 0 auto 10px;
}

.btn_contact ul li span {
	padding-left: 27px;
	display: inline-block;
}

footer{
	height: auto;
	padding: 35px 0 70px;
	background: #fff;	
}

.footer_in .nav {
	font-family: 'Roboto Condensed', sans-serif;
	display: table;
    margin: 0 auto 45px;
}

.footer_in .nav li {
	display: table-cell;
	padding: 0 30px;
    line-height: 18px;
}

.footer_in .copyright{
	color: #656565;
	font-size: 84%;
}


/*
------------------- about -----------------------
*/
#about .catch {
	background: url(../img/about_catch.jpg) 50% 105px no-repeat;
}


/*
------------------- access -----------------------
*/
#access .main {
    background-color: #f2f2f2;
    padding: 70px 0 0;
}

#access .catch {
	background: url(../img/access_catch.jpg) 50% 105px no-repeat;
}

.access_direction {
	line-height: 22px;
	padding-top: 30px;
}

#access .company_info .company_info_in {
    padding: 0;
}

#access .company_info .profile_in {
    padding: 0 0 95px;
	border-bottom: none;
}

#access .company_info .profile_in dl dt {
    margin-bottom: 20px;
}

.profile_in.komazawa img,
.profile_in.aoyama img,
.profile_in.jiyuugaoka img {
	margin-bottom: 40px;
	padding-top: 15px;
	width: 100%;
    max-width: 715px;
    height: auto;
}

#access .map_wrap{
	position: relative;
    max-width: 1000px;
    margin: 0 auto;
	padding: 45px 0 0;
	border-top: 1px solid #ffffff;
}

.parking_txt {
	color: #c61a22;
}

#map_canvas01,
#map_canvas02,
#map_canvas03 {
	height: 390px;
	width: 100%;
}


/*
------------------- history -----------------------
*/
#history .catch {
	background: url(../img/history_catch.jpg) 50% 105px no-repeat;
}

.history_in {
	max-width: 1000px;
	margin: 0 auto;
	font-size: 117%;
}

.history_list {
    border-top: 1px solid #ffffff;
}

.history_list li {
    border-bottom: 1px solid #ffffff;
	padding: 15px 0 15px 200px;
}

.history_list li a {
	text-decoration: underline;
}

.history_list div {
	position: relative;
	padding-left: 180px;
	text-align: left;
	line-height: 1.5;
}

.history_list div p {
	position: absolute;
	left: 0;
	top: 4px;
	width: 120px;
	display: table;
	line-height: 1.5;
}

.history_list div p span {
	width: 60%;
	display: table-cell;
}

.history_list div p span + span {
	text-align: right;
	width: 40%;
}