@charset "UTF-8";
@charset "UTF-8";

  .owl-carousel .owl-wrapper:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
} .owl-carousel{
display: none;
position: relative;
width: 100%;
-ms-touch-action: pan-y;
z-index:100;
}
.owl-carousel .owl-wrapper{
display: none;
position: relative;
-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
overflow: hidden;
position: relative;
width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
-webkit-transition: height 500ms ease-in-out;
-moz-transition: height 500ms ease-in-out;
-ms-transition: height 500ms ease-in-out;
-o-transition: height 500ms ease-in-out;
transition: height 500ms ease-in-out;
}
.owl-carousel .owl-item{
float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
cursor: pointer;
}
.owl-controls {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
} .grabbing { 
cursor:url(/common/css/grabbing.png) 8 8, move;
} .owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
-webkit-backface-visibility: hidden;
-moz-backface-visibility:    hidden;
-ms-backface-visibility:     hidden;
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
}
      @media screen and (min-width: 640px) {
#index header#head {
width:100%;
position:absolute;
z-index:100;
}
#index header#head h1 {
width:1000px;
height:120px;
text-align:left;
padding-left:30px;
padding-top:36px;
margin:0 auto;
}
}
@media screen and (max-width: 639px) {
#index header#head {
width:100%;
}
} @media screen and (min-width: 640px) {
#index #mainImgBlock nav {
width:420px;
height:320px;
position:absolute;
bottom:10%;
right:10%;
overflow:hidden;
}
#index #mainImgBlock nav ul li {
width:70px;
padding-right:14px;
float:left;
}
#index #mainImgBlock nav ul li a {
width:56px;
background-position:0% 0%;
background-repeat:no-repeat;
text-indent:-9999px;
position:relative;
overflow:hidden;
display:block;
transition: opacity 0.3s;
-webkit-transition: opacity 0.3s;
}
#index #mainImgBlock nav ul li a:hover {
opacity: .5;
-webkit-opacity: .5;
-moz-opacity: .5;
}
#index #mainImgBlock nav ul li.n01 {
margin-top:20px;
}
#index #mainImgBlock nav ul li.n01 a {
height:267px;
background-image:url(/common/images/index/nav_01.png);
}
#index #mainImgBlock nav ul li.n02 {
margin-top:0px;
}
#index #mainImgBlock nav ul li.n02 a {
height:311px;
background-image:url(/common/images/index/nav_02.png);
}
#index #mainImgBlock nav ul li.n03 {
margin-top:30px;
}
#index #mainImgBlock nav ul li.n03 a {
height:202px;
background-image:url(/common/images/index/nav_03.png);
}
#index #mainImgBlock nav ul li.n04 {
margin-top:80px;
}
#index #mainImgBlock nav ul li.n04 a {
height:210px;
background-image:url(/common/images/index/nav_04.png);
}
#index #mainImgBlock nav ul li.n05 {
margin-top:20px;
}
#index #mainImgBlock nav ul li.n05 a {
height:243px;
background-image:url(/common/images/index/nav_05.png);
}
#index #mainImgBlock nav ul li.n06 {
margin-top:50px;
}
#index #mainImgBlock nav ul li.n06 a {
height:245px;
background-image:url(/common/images/index/nav_06.png);
}
}
@media screen and (max-width: 639px) {
#index #mainImgBlock nav {
width:100%;
position:absolute;
top:0%;
background:hsla(0,0%,0%,0.8);
right:-100%;
overflow:hidden;
z-index:1000;
}
#index #mainImgBlock nav ul li {
border-bottom:1px solid #333;
}
#index #mainImgBlock nav ul li a {
padding:10px;
color:#fff;
display:block;
}
#index #mainImgBlock nav ul li a:before {
font-family:'fontello';
content: '\e80b';
display:inline-block;
margin-right:5px;
}
#index #mainImgBlock nav ul:after {
width:100%;
content:"close";
color:#fff;
text-align:center;
padding:10px;
display:block;
}
} @media screen and (min-width: 640px) {
#mainImgBlock {
width:100%;
height:680px;
}
#mainImgBlock .glide__track li {
width:100%;
height:680px;
position:relative;
}
#mainImgBlock .glide__track li .box {
color:#fff;
padding:15px 30px;
display:inline-block;
position:absolute;
bottom:20px;
left:15%;
}
#mainImgBlock .glide__track li.black .box {
color:#444;
background:url(/common/images/common/bg_white_a70.png);
}
#mainImgBlock .glide__track li .box span {
font-size:143%;
line-height:1.3;
display:block;
}
#mainImgBlock .glide__track li .box .ttl {
font-size:158%;
letter-spacing:5px;
line-height:1.3;
}
#mainImgBlock .glide__bullets {
width:100%;
height:20px;
position:absolute;
left:0;
bottom:10px;
text-align:center;
z-index:100;
}
#mainImgBlock .glide__bullets button {
width:10px;
height:10px;
line-height:10px;
border-radius:50%;
background:#fff;
display:inline-block;
margin:0 4px;
opacity:0.4;
padding:0;
border:none;
outline:none;
cursor:pointer;
}
#mainImgBlock .glide__bullets button:hover {
opacity:0.8;
}
#mainImgBlock .glide__bullets button.active {
opacity:1;
}
}
#mainImgBlock .glide__track li a {
width:100%;
height:100%;
position:absolute;
left:0px;
top:0px;
display:block;
z-index:90;
}
@media screen and (max-width: 639px) {
#mainImgBlock {
width:100%;
height:320px;
}
#mainImgBlock .glide__track li {
width:100%;
height:320px;
position:relative;
}
#mainImgBlock .glide__track li .box {
color:#fff;
position:absolute;
padding:15px;
bottom:20px;
left:20px;
}
#mainImgBlock .glide__track li.black .box {
color:#444;
background:url(/common/images/common/bg_white_a70.png);
}
#mainImgBlock .glide__track li .box span {
display:block;
}
#mainImgBlock .glide__track li .box .ttl {
font-size:143%;
letter-spacing:5px;
line-height:1.3;
}
#mainImgBlock .glide__bullets {
display:none;
}
} @media screen and (min-width: 640px) {
#instaArea {
width:100%;
height:140px;
padding:20px;
background:url(/common/images/index/bg_insta_line.png) repeat-x bottom;
position:relative;
}
#instaArea header {
width:110px;
height:100px;
letter-spacing:0;
text-align:center;
position:absolute;
left:20px;
top:20px;
background:#fff;
padding:15px 0;
z-index:100;
}
#instaArea header span {
font-size:71%;
}
#instaArea .slideBlock {
width:100%;
position:relative;
z-index:90;
overflow:hidden;
}
#instaArea .slideBlock .item {
width:100%;
padding:0 5px;
}
#instaArea .slideBlock .item img {
width:100px;
}
}
@media screen and (max-width: 639px) {
#instaArea {
width:100%;
border-bottom:1px solid #000;
padding-bottom:15px;
}
#instaArea header {
line-height:20px;
letter-spacing:0;
text-align:center;
padding:5px 10px;
z-index:100;
}
#instaArea header span {
font-size:71%;
display:block;
float:right;
}
#instaArea header h3 {
float:left;
}
#instaArea header h3 img {
width:60px;
height:auto;
}
#instaArea .slideBlock {
width:100%;
position:relative;
z-index:90;
}
#instaArea .slideBlock .item {
width:80px;
text-align:center;
}
#instaArea .slideBlock .item img {
width:75px !important;
height:auto;
margin:0 auto;
}
} @media screen and (min-width: 640px) {
#conceptBlock {
width:940px;
padding:90px 0 50px;
margin:0 auto;
overflow:hidden;
zoom:1;
}
#conceptBlock figure {
width:280px;
float:left;
}
#conceptBlock figure img {
width:100%;
height:auto;
}
#conceptBlock .inner {
width:600px;
float:right;
}
#conceptBlock .inner header {
text-align:left;
padding-bottom:20px;
}
#conceptBlock .inner header h2 {
font-size:143%;
letter-spacing:0;
font-family:"futura-pt";
}
#conceptBlock .inner header h3 {
font-size:200%;
}
#conceptBlock .inner header h3 br {
display:none;
}
#conceptBlock .inner .textBox p {
line-height:2.2;
}
#conceptBlock .inner .more {
padding-top:20px;
}
#conceptBlock .inner .more a {
width:113px;
height:26px;
font-size:117%;
line-height:26px;
text-align:center;
background:url(/common/images/index/bg_btn_more.png) no-repeat;
display:block;
}
#conceptBlock .inner .more a i {
font-size:75%;
}
}
@media screen and (max-width: 639px) {
#conceptBlock {
padding:20px 0;
margin:0 auto;
overflow:hidden;
zoom:1;
}
#conceptBlock figure {
width:280px;
height:280px;
margin:0 auto;
}
#conceptBlock figure img {
width:100%;
}
#conceptBlock .inner {
padding:5px 20px 25px 20px;
}
#conceptBlock .inner header {
text-align:center;
padding-bottom:20px;
}
#conceptBlock .inner header h2 {
font-size:143%;
letter-spacing:0;
font-family:"futura-pt";
}
#conceptBlock .inner header h3 {
font-size:143%;
}
#conceptBlock .inner .textBox p {
font-size:93%;
}
#conceptBlock .inner .more {
padding-top:20px;
}
#conceptBlock .inner .more a {
width:150px;
height:32px;
line-height:30px;
text-align:center;
border:1px solid #000;
border-radius:15px;
display:block;
margin:0 auto;
}
#conceptBlock .inner .more a i {
font-size:75%;
}
} @media screen and (min-width: 640px) {
.guideArea {
width:1000px;
margin:0 auto 50px;
overflow:hidden;
zoom:1;
clear:both;
padding:20px 20px;
background:url(/common/images/index/bg_index_info.png) no-repeat 50% 0;
}
#informationBlock {
width:50%;
float:left;
padding-right:40px;
}
#guideBlock {
width:50%;
float:right;
padding-left:40px;
}
#informationBlock header {
padding-bottom:25px;
background:url(/common/images/index/bg_index_info_bar.png) no-repeat 100% 100%;
position:relative;
overflow:hidden;
}
#informationBlock header > i {
float:left;
margin-right:10px;
}
#informationBlock header h3 {
font-size:158%;
line-height:1.2;
font-weight:bold;
margin:2px 10px 0;
}
#informationBlock header small {
font-size:114%;
line-height:1.2;
display:block;
}
#informationBlock header .more {
width:107px;
height:23px;
font-size:117%;
line-height:23px;
text-align:center;
background:url(/common/images/index/bg_info_more.png) no-repeat;
position:absolute;
right:0px;
top:11px;
}
#informationBlock header .more i {
font-size:75%;
}
#informationBlock .information dl {
padding:18px 5px;
background:url(/common/images/index/bg_index_info_bar.png) no-repeat 100% 100%;
position:relative;
}
#informationBlock .information dl a {
width:100%;
height:100%;
display:block;
position:absolute;
left:0;
top:0;
}
#informationBlock .information dl dt {
width:90px;
font-size:86%;
line-height:60px;
text-align:center;
float:left;
}
#informationBlock .information dl dt img {
width:100%;
height:auto;
}
#informationBlock .information dl dd {
width:320px;
float:right;
padding-top:5px;
}
#informationBlock .information dl dd time {
font-size:86%;
display:block;
font-weight:700;
}
#guideBlock h3 {
text-align:center;
font-size:158%;
background:url(/common/images/index/bg_guide_bar.png) no-repeat 50% 100%;
padding:0 10px 10px;
margin-bottom:25px;
}
#guideBlock figure {
text-align:center;
padding-bottom:15px;
}
#guideBlock p {
width:400px;
margin:0 auto;
padding-bottom:25px;
}
#guideBlock .more a {
width:200px;
line-height: 30px;
text-align:center;
font-size:93%;
background:url(/common/images/index/bg_show_more.png) no-repeat 50% 50%;
background-size: 100% 30px;
display:block;
margin:0 auto;
position:relative;
}
#guideBlock .more a u {
position:absolute;
left:-10px;
top:-10px;
}
}
@media screen and (max-width: 639px) {
#informationBlock {
padding:0px 10px 50px;
background:#E5E5E5;
position:relative;
}
#informationBlock header {
text-align:center;
padding-bottom:10px;
position:static;
border-bottom:1px dashed #000;
}
#informationBlock header > i {
text-align:center;
margin:0 0 10px;
}
#informationBlock header > i img {
width:36px;
}
#informationBlock header h3 {
font-size:143%;
line-height:1.2;
font-weight:bold;
margin:2px 10px 0;
}
#informationBlock header small {
line-height:1.2;
display:block;
}
#informationBlock header .more {
width:150px;
height:30px;
line-height:30px;
text-align:center;
background:#fff;
border-radius:15px;
position:absolute;
left:50%;
bottom:10px;
margin-left:-75px;
}
#informationBlock header .more i {
font-size:75%;
}
#informationBlock .information dl {
padding:18px 5px;
border-bottom:1px dashed #000;
position:relative;
}
#informationBlock .information dl a {
width:100%;
height:100%;
display:block;
position:absolute;
left:0;
top:0;
}
#informationBlock .information dl dt {
width:30%;
font-size:86%;
line-height:60px;
text-align:center;
float:left;
}
#informationBlock .information dl dt img {
width:100%;
height:auto;
}
#informationBlock .information dl dd {
width:65%;
float:right;
padding-top:5px;
}
#informationBlock .information dl dd time {
font-size:86%;
display:block;
font-weight:700;
}
#guideBlock {
padding:10px 10px 25px;
border-bottom:1px solid #ccc;
}
#guideBlock h3 {
text-align:center;
font-size:143%;
padding:20px 0;
}
#guideBlock figure {
text-align:center;
padding-bottom:15px;
}
#guideBlock figure img {
width:100%;
height:auto;
}
#guideBlock p {
margin:0 15px;
padding-bottom:25px;
}
#guideBlock .more a {
width:170px;
height:30px;
line-height:30px;
text-align:center;
background:#E5E5E5;
display:block;
margin:0 auto;
position:relative;
border-radius:15px;
}
#guideBlock .more a i img {
display:none;
}
#guideBlock .more a i:after {
font-size:75%;
font-family:"fontello";
content: '\e800';
}
} @media screen and (min-width: 640px) {
#worksBlock {
width:1000px;
height:500px;
background:url(/common/images/index/bg_index_works.png) no-repeat 50% 10px;
margin:0 auto 80px;
}
#worksBlock header {
line-height:30px;
text-align:left;
padding-left:50px;
}
#worksBlock header h2 span {
font-family:"futura-pt";
letter-spacing:0;
font-size:286%;
margin-right:5px;
}
#worksBlock .inner {
width:920px;
margin:0 auto;
}
#worksBlock .inner p {
text-align:center;
padding:30px 0 40px;
}
#worksBlock article {
text-align:center;
padding:0 5px;
}
#worksBlock article span {
font-size:114%;
padding-bottom:10px;
display:block;
}
#worksBlock article h3 {
font-weight:bold;
font-family:"futura-pt","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
line-height:1.7;
letter-spacing:0;
}
#worksBlock article figure {
width:200px;
border-radius:50%;
margin:0 auto 20px;
overflow:hidden;
}
#worksBlock article figure a {
border-radius:50%;
display:block;
}
#worksBlock article figure img {
width:200px;
height:200px;
border-radius:50%;
}
#worksBlock article.demo {
display:none !important;
}
#worksBlock .inner .more {
text-align:center;
padding-top:20px;
}
#worksBlock .inner .more a {
width:184px;
height:32px;
font-size:117%;
line-height:32px;
text-align:center;
border-radius:16px;
display:block;
margin:0 auto;
}
#worksBlock .inner .more a i {
font-size:75%;
}
}
@media screen and (max-width: 639px) {
#worksBlock {
text-align:center;
padding:20px 0;
overflow:hidden;
}
#worksBlock header {
line-height:30px;
}
#worksBlock header h2 {
font-size:71%;
line-height:1.2;
display:block;
}
#worksBlock header h2 span {
font-family:"futura-pt";
letter-spacing:0;
font-size:300%;
display:block;
}
#worksBlock .inner {
height:410px;
position:relative;
}
#worksBlock .inner p {
width:300px;
font-size:86%;
text-align:left;
padding:10px 15px 20px;
}
#worksBlock .slider {
width:660px;
position:absolute;
top:100px;
left:50%;
margin-left:-330px;
}
#worksBlock article {
width:220px;
height:300px;
text-align:center;
padding:0 10px;
}
#worksBlock article span {
font-size:71%;
padding-bottom:3px;
display:block;
}
#worksBlock article h3 {
font-size:86%;
font-family:"futura-pt","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
line-height:1.7;
letter-spacing:0;
}
#worksBlock article figure {
width:200px;
border-radius:20%;
margin:0 auto 20px;
overflow:hidden;
}
#worksBlock article figure img {
width:200px;
height:200px;
border-radius:20%;
}
#worksBlock .inner .more {
padding-top:290px;
}
#worksBlock .inner .more a {
width:150px;
height:32px;
line-height:30px;
text-align:center;
border:1px solid #000;
border-radius:15px;
display:block;
margin:0 auto;
}
#worksBlock .inner .more a i {
font-size:75%;
}
} @media screen and (min-width: 640px) {
#showroomBlock {
position:relative;
padding-top:40px;
}
#showroomBlock header {
width:1000px;
height:450px;
position:absolute;
left:50%;
margin-left:-500px;
top:0px;
}
#showroomBlock header figure {
position:absolute;
left:0px;
top:0px;
}
#showroomBlock header .in {
width:350px;
height:80px;
position:absolute;
left:100px;
bottom:50px;
}
#showroomBlock header h2 {
width:350px;
font-size:215%;
letter-spacing:0;
text-align:center;
position:relative;
z-index:10;
background:url(/common/images/index/bg_showroom_bar.png) no-repeat 50% 100%;
}
#showroomBlock header span {
width:350px;
text-align:right;
position:relative;
z-index:10;
display:block;
padding-right:10px;
}
#showroomBlock header h2 u {
font-size:67%;
text-decoration:none;
}
#showroomBlock .inner {
height:300px;
background:#F7F7F7;
padding:60px 0;
}
#showroomBlock .inner .box {
width:960px;
text-align:center;
padding-left:500px;
margin:0 auto;
}
#showroomBlock .inner .box h3 {
font-size:158%;
text-align:center;
background:url(/common/images/common/bg_dot_line.png) repeat-x bottom;
display:inline-block;
padding:0 10px 10px;
margin:0 auto 25px;
}
#showroomBlock .inner .box .textBox {
text-align:left;
}
#showroomBlock .inner .box .textBox p {
line-height:2;
}
#showroomBlock .btn {
width:960px;
text-align:center;
padding-left:500px;
margin:20px auto;
position:relative;
z-index:100;
}
#showroomBlock .btn ul li {
width:50%;
float:left;
}
#showroomBlock .btn ul li a {
height:100px;
font-weight:bold;
background:url(/common/images/index/bg_btn_access.png) no-repeat 50% 23px;
display:block;
}
#showroomBlock .btn ul li.schedule a {
background:url(/common/images/index/bg_btn_showroom.png) no-repeat 50% 23px;
}
#showroomBlock .btn ul li a i {
display:block;
margin-bottom:5px;
}
#showroomBlock .btn ul li.schedule a img {
width: 36px;
height: auto;
}
#showroomBlock .btn ul li a span {
font-size:84%;
line-height:1.1;
display:block;
}
}
@media screen and (max-width: 639px) {
#showroomBlock {
position:relative;
padding-top:15px;
background:#F7F7F7;
}
#showroomBlock header {
padding-bottom:10px;
}
#showroomBlock header figure img {
width:230px;
height:auto;
margin:0 auto 10px;
}
#showroomBlock header h2 {
font-size:143%;
letter-spacing:0;
text-align:center;
display:inline-block;
background:url(/common/images/index/bg_showroom_bar.png) no-repeat 50% 100%;
}
#showroomBlock header span {
font-size:71%;
display:block;
padding:5px 0 15px;
}
#showroomBlock header h2 u {
text-decoration:none;
}
#showroomBlock .inner {
}
#showroomBlock .inner .box {
text-align:center;
}
#showroomBlock .inner .box h3 {
font-size:129%;
letter-spacing:0;
text-align:center;
background:url(/common/images/common/bg_dot_line.png) repeat-x bottom;
background-size:auto 2px;
display:inline-block;
padding:0 0px 10px;
margin:0 auto 15px;
}
#showroomBlock .inner .box .textBox {
padding:0 20px;
text-align:left;
}
#showroomBlock .inner .box .textBox p {
line-height:1.6;
}
#showroomBlock .btn {
text-align:center;
padding:20px;
position:relative;
z-index:100;
}
#showroomBlock .btn ul li {
margin-bottom:10px;
}
#showroomBlock .btn ul li a {
height:50px;
line-height:1.2;
font-weight:bold;
text-align:left;
background:#fff;
display:block;
padding:10px 20px;
}
#showroomBlock .btn ul li a i {
line-height:30px;
float:left;
display:block;
margin:0 10px;
}
#showroomBlock .btn ul li.access a i img {
width:18px;
}
#showroomBlock .btn ul li.schedule a i img {
width:20px;
}
#showroomBlock .btn ul li a span {
display:block;
}
} @media screen and (min-width: 640px) {
.top-banner-area {
width: 1000px;
margin: 0 auto;
text-align: center;
padding: 20px 0;
}
.top-banner-area ul li {
width: 50%;
float: left;
}
}
@media screen and (max-width: 639px) {
.top-banner-area {
text-align: center;
padding: 10px;
}
.top-banner-area ul li {
padding: 5px 0;
}
.top-banner-area ul li a img {
max-width: 100%;
height: auto;
}
} @media screen and (min-width: 640px) {
#subNav {
width:1000px;
height:310px;
margin:0 auto;
padding:80px 0;
overflow:hidden;
zoom:1;
}
#subNav ul li {
width:20%;
height:150px;
float:left;
}
#subNav ul li a {
font-size:129%;
text-align:center;
display:block;
}
#subNav ul li a i {
display:block;
padding-bottom:10px;
}
#subNav ul li a small {
font-size:89%;
display:block;
}
#subNav ul li.voice ,
#subNav ul li.column {
background:url(/common/images/index/bg_subnav_line_01.png) no-repeat 100% 50%;
}
#subNav ul li.faq {
background:url(/common/images/index/bg_subnav_line_02.png) no-repeat 100% 50%;
}
#subNav ul li.staff {
background:url(/common/images/index/bg_subnav_line_03.png) no-repeat 100% 50%;
}
}
@media screen and (max-width: 639px) {
#subNav {
margin:0 auto;
padding:15px 0;
background:url(/common/images/common/bg_line_h_sp.png) repeat-y 50% 100%;
background-size:5px auto;
overflow:hidden;
zoom:1;
}
#subNav ul {
}
#subNav ul li {
width:50%;
line-height:1.3;
height:120px;
padding:15px 0;
float:left;
background:url(/common/images/common/bg_dot_line.png) repeat-x 0% 100%;
background-size:118px auto;
}
#subNav ul li:nth-last-of-type(1) {
background: none;
}
#subNav ul li a {
text-align:center;
display:block;
}
#subNav ul li a i {
display:block;
padding-bottom:10px;
}
#subNav ul li a i img {
width:40px;
height:auto;
}
#subNav ul li a small {
font-size:86%;
display:block;
}
}