/* crumbs bottom */
.misc #contents > .crumbs { width: 100%; line-height: 1.4em;margin-top: 25px;}
.misc #contents > .crumbs ul { text-align: center; }
.misc #contents > .crumbs ul li { font-size: 11px; display: inline-block; margin: 0 5px; letter-spacing: 2px;}
.misc #contents > .crumbs ul li a {color: #000;}
.misc #contents > .crumbs ul li a:hover {}
.misc #contents > .crumbs ul li:last-child { font-size: 14px; letter-spacing: 1px;}
.misc #contents > .crumbs ul li .fa {color:#A1914D;}

.misc #contents .title {font-size: 24px;letter-spacing: 4px;font-weight: 700;padding-bottom: 25px;margin-bottom: 50px; text-align: center; position: relative;}
.misc #contents .title:after {content:'';display:block;width:20px;height:2px;background:#A1914D;position:absolute;left:50%;margin-left:-10px;bottom:0;}
.misc #contents .btn { margin-top: 25px;}
@media screen and (max-width: 767px) {
    .misc #contents .title {font-size: 21px;letter-spacing: 2px;}
}
/* service */
.misc #contents {padding: 50px 0;}
.misc #contents .main {display: block;background-position: center;margin: 50px 0px 0px; position:relative; background-color: #313131; height: auto;background-image: url(../images/about/main.jpg);}

.misc #contents .main .inner {display: block;margin: 0 auto;max-width: 1440px; padding: 100px;}
.misc #contents .main .inner h1 {font-weight: 700;text-align: left; font-size: 60px; letter-spacing: 3px;color:#A1914D; line-height: 1em;margin-bottom: 25px;}
.misc #contents .main .inner h2 {color: #fff;font-weight: 700;text-align: left; font-size: 36px; letter-spacing: 1px;line-height: 1em;margin-bottom: 50px;}
.misc #contents .main .inner h3 { font-size: 21px; line-height: 1.4em;color: #fff;text-align: left;}
.misc #contents .main .crumbs { width: 100%; line-height: 1.4em; position: absolute; bottom:50px; right:50px;}
.misc #contents .main .crumbs ul { text-align: right; }
.misc #contents .main .crumbs ul li { font-size: 10px; display: inline-block; margin: 0 5px; letter-spacing: 2px;}
.misc #contents .main .crumbs ul li a {color: #FFF;}
.misc #contents .main .crumbs ul li a:hover {}
.misc #contents .main .crumbs ul li:last-child { font-size: 14px; letter-spacing: 1px;}
.misc #contents .main .crumbs ul li .fa {color:#A1914D;}
.misc #contents .crumbs.bottom {padding-top: 25px;}
@media screen and (max-width: 767px) {
    .misc #contents {margin: 0px;}
    .misc #contents .main {margin: 0px 0px 25px;}
    .misc #contents .main .inner { margin: 0 auto;min-width:inherit;padding: 50px}
    .misc #contents .main .inner h1 {text-align: center; font-size: 54px; letter-spacing: 2px;margin-bottom: 50px;}
    .misc #contents .main .inner h2 {text-align: left; font-size: 30px;margin-bottom: 25px;}
    .misc #contents .main .inner h3 { font-size: 14px; line-height: 1.2em;color: #fff;}
    .misc #contents .main .crumbs {display: none;}
    .misc #contents .crumbs.bottom {padding-top: 0px;min-width:auto;}
}

.misc #contents .title {font-size: 24px;letter-spacing: 4px;font-weight: 700;padding-bottom: 25px;margin-bottom: 50px; text-align: center; position: relative;}
.misc #contents .title:after {content:'';display:block;width:20px;height:2px;background:#A1914D;position:absolute;left:50%;margin-left:-10px;bottom:0;}
.misc #contents .btn { margin-top: 25px;}
.misc #contents .slider {display: block; position: relative;margin: 100px 130px 150px; height: auto;}
.misc #contents .slider .swiper-pagination { text-align: center; width: 100%;bottom: -85px;}
.misc #contents .slider .swiper-pagination .swiper-pagination-bullet {margin: 0 12px;}
@media screen and (max-width: 767px) {
    .misc #contents .slider {display: block; position: relative;margin: 0px -25px 50px;height: 100%;}
    .misc #contents .slider .swiper-pagination { text-align: center; width: 100%;bottom: -35px;}
    .misc #contents .slider .swiper-pagination .swiper-pagination-bullet {margin: 0 3px;}
    .misc #contents .slider .swiper-button-prev,
    .misc #contents .slider .swiper-button-next {width: 30px;height: 30px;line-height: 30px; color: #ccc;font-size: 24px;position: absolute;bottom:-40px;top: inherit;text-align: center;}
}

.misc #service {padding:50px 50px 50px;-webkit-transition: all .3s ease;transition: all .3s ease;background-color:#f6f4ed;margin-bottom: 5px;}
.misc #service > p {margin-bottom: 50px;}
.misc #service .block {}
.misc #service figure {position: relative;margin-bottom: 25px; overflow: hidden;background-color: #000;}
.misc #service span { position: relative;z-index: 999;text-align: center; background-color: #fff;color:#A1914D;width: 150px;display: inline-block;border: 2px solid #A1914D;font-weight: 400; font-size:12px;line-height:2em;position: absolute; top:-15px; left:50%;margin-left: -75px;letter-spacing: 2px;}
.misc #service a {display: block; color: #000;}
.misc #service a:hover {color:#A1914D;}
.misc #service a .inner {padding: 0px;z-index: 99; position: relative;}
.misc #service a .inner h1 {font-weight: 700;text-align: center; font-size: 18px; line-height: 1.0em;}
.misc #service a .fa {display: none;}
.misc #service .title {font-size: 24px;letter-spacing: 4px;font-weight: 700;padding-bottom: 25px;margin-bottom: 50px; text-align: center; position: relative;}
.misc #service .title:after {content:'';display:block;width:20px;height:2px;background:#A1914D;position:absolute;left:50%;margin-left:-10px;bottom:0;}
@media screen and (max-width: 767px) {
    .misc #service {padding: 50px 0px 30px;margin-bottom: 0px;}
    .misc #service > p {margin-bottom: 40px;}
    .misc #service  {font-size: 21px;letter-spacing: 2px;}
    .misc #service .title {font-size: 21px;letter-spacing: 2px;margin-bottom: 5px;}
    .misc #service .block { }
    .misc #service .block a {display: block;position: relative; height: 80px;margin-top: 5px;background-color: #fff;}
    .misc #service .block a figure {position: absolute; top: 0; left: 0;width: 120px; height: 80px;margin: 0;padding: 0;}
    .misc #service .block a span {padding: 0px;  width: 100px;text-align: center;top:15px;left: 215px; position: absolute;border: 1px solid #A1914D;line-height:15px; font-size:11px; letter-spacing: 1px;}
    .misc #service .block a .inner { position: absolute; top: 0; left: 0; width: 100%; height: 80px; text-align: left;padding-left: 140px;}
    .misc #service .block a .inner h1 {text-align: left;margin-top: 40px; font-size: 16px; letter-spacing: 0;}
    .misc #service .block a .fa { display: block;position: absolute; top: 28px; font-size: 24px; right: 15px;color:#A1914D;}
    .misc #service .block a:hover { background-color:#A1914D;color: #fff;}
    .misc #service .block a:hover .fa {color: #fff;}
    .misc #service .row {}
}

#map_canvas { height: 400px; width: 100%;margin: 0 auto;}
.misc #map_canvas { height: 400px; width: 100%;margin: 0 auto;}
.address {font-weight: 400;text-align: center; font-size: 16px;padding: 20px 0;background-color: #222; margin: 0 auto 50px; color: #FFF;}
.address span { margin-right: 20px;}
.address a {color: #A1914D;}
@media screen and (max-width: 767px) {
    #map_canvas { height: 350px;}
    .address { padding: 25px;margin-bottom: 0;}
    .address span {font-size: 12px;display: block; line-height: 1.6em;margin-right: 0;}
}
