@charset "UTF-8";
@import url(reset.css);
/*----------------------Reset----------------------*/
a:link, a:hover, a:active { text-decoration: none; cursor: pointer; }
*:focus { outline: none  !important; }
.rightfix { float: right; }
.leftfix { float: left; }
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; line-height: normal; margin: 0; padding: 0; }
input, button, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; outline: none !important; }
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
ol, ul, li { list-style: none; margin: 0; padding: 0; }
table { border-spacing: 0; border-collapse: collapse; }
th, td { font-weight: normal; }

/*
  Global 
================================================================== */
@-ms-viewport {
 width: device-width; 
}
body, html { height: 100%; }
body { position: relative; padding: 0; margin: 0; font-family: Arial, Microsoft YaHei, Microsoft JhengHei, sans-serif; font-size: 16px; color: #000; /*background: #def2fb; */overflow-x: hidden; }
input, select { color: #5a6779; }
p { line-height: 1.5; margin: 0; }
select { appearance: none; -moz-appearance: none; -webkit-appearance: none; }
label { margin-bottom: 0; font-weight: normal; cursor: pointer; }
label > * { display: inline-block; vertical-align: middle; }
[class*='_'] > * { display: inline-block; vertical-align: middle; }

/* Table */
.css-table { display: table; }
.css-tr { display: table-row; }
.css-td { display: table-cell; vertical-align: middle; }

/*
  Header
================================================================== */
header { position: relative; width: 100%; background: #fff; text-align: center; transition: 0.5s; -o-transition: 0.5s; -webkit-transition: 0.5s; z-index: 100; }
header .logo { z-index: 10; position: relative; display: inline-block; width: 100%; height: 120px; text-align: center; padding: 15px 0; background: #fff; transition: 0.5s; -o-transition: 0.5s; -webkit-transition: 0.5s; }
header .logo img { width: 280px; height: 90px; -webkit-transform: translate(0,-200%); -o-transform: translate(0,-200%); transform: translate(0,-200%); -webkit-transition: .8s; -o-transition: .8s; transition: .8s; }
header nav { background: #b79d62; }
header nav > ul { width: 1200px; margin: 0 auto; }
header nav > ul::before { z-index: -1; content: ''; position: absolute; left: 0; right: 0; width: 100%; height: 50px; background: #b79d62; background: rgba(0,0,0,.6); -webkit-transform: translateY(-101%); transform: translateY(-101%); -webkit-transition: all .6s cubic-bezier(.165,.84,.44,1); transition: all .6s cubic-bezier(.165,.84,.44,1); -webkit-transition-timing-function: cubic-bezier(.165,.84,.44,1); transition-timing-function: cubic-bezier(.165,.84,.44,1); }
header nav > ul > li { position: relative; float: left; font-size: 18px; color: #fff; text-align: center; width: calc(100%/6); transition: 0.5s; -o-transition: 0.5s; -webkit-transition: 0.5s; }
header nav > ul > li > a { display: block; font-size: 16px; color: #fff; line-height: 50px; -webkit-transform: translate(0,-100%); -o-transform: translate(0,-100%); transform: translate(0,-100%); -webkit-transition: .8s; -o-transition: .8s; transition: .8s;  }
header nav > ul > li:hover { color: #b79d62; background: #333; }
header nav > ul > li:hover > a { color: #b79d62; }
header nav > ul > li:hover .subMenu { top: 50px; bottom: auto; opacity: 1; }
header nav > ul > li.enable { color: #b79d62; background: #333; }
header nav > ul > li.enable > a { color: #b79d62; }

header.change .logo img { -webkit-transform: translate(0,0); -o-transform: translate(0,0); transform: translate(0,0); }
header.change nav > ul > li > a { -webkit-transform: translate(0,0); -o-transform: translate(0,0); transform: translate(0,0); }

/* 選單固定 */
.setUp header nav > ul { position: fixed; width: 100%; top: 0; }
.setUp header nav > ul::before { transform: translateY(0); height: 50px; }
content { display: block; }

/* 副選單 */
header .subMenu { z-index: -1; opacity: 1; position: absolute; top: 0; left: 0; max-height: 0; width: 100%; background: #333; overflow: hidden; transition: .6s; -o-transition: .6s; -webkit-transition: .6s; }
header .subMenu a { display: block; font-size: 16px; color: #b79d62; line-height: 50px; transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; }
header .subMenu a:hover { color: #333; background: #b79d62; }

/* m-漢堡 */
.hamburger-box { z-index: 100; opacity: 0; position: absolute; top: 50%; right: 5%; width: 8vmin; height: 6vmin; transform: translate(0,-300%); -o-transform: translate(0,-300%); -webkit-transform: translate(0,-300%); transition: 0.8s; -o-transition: 0.8s; -webkit-transition: 0.8s; }

.hamburger-inner { transition: background-color 0s linear .13s; }
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before { position: absolute; width: 100%; height: 1.04vmin; border-radius: 5px; transition-timing-function: ease; transition-duration: .15s; transition-property: transform; }
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before { background: #b79d62; }
.hamburger-inner:after, .hamburger-inner:before { display: block; content: ''; }
.hamburger-inner:before { top: 2.4vmin; transition: top .1s cubic-bezier(.33333,.66667,.66667,1) .2s, transform .13s cubic-bezier(.55,.055,.675,.19) }
.hamburger-inner:after { top: 4.8vmin; transition: top .2s cubic-bezier(.33333,.66667,.66667,1) .2s, transform .13s cubic-bezier(.55,.055,.675,.19) }

.isOpen .hamburger-box .hamburger-inner { transition-delay: 0.22s; background-color: transparent; }
.isOpen .hamburger-box .hamburger-inner:before { top: 0.85vmin; transition: top .1s cubic-bezier(.33333,0,.66667,.33333) .15s,transform .13s cubic-bezier(.215,.61,.355,1) .22s; transform: translate3d(0,10px,0) rotate(45deg); }
.isOpen .hamburger-box .hamburger-inner:after { top: 0.85vmin; transition: top .2s cubic-bezier(.33333,0,.66667,.33333),transform .13s cubic-bezier(.215,.61,.355,1) .22s; transform: translate3d(0,10px,0) rotate(-45deg); }

/* m-Menu */
.nav-overlay { position: fixed; left: 0; top: 0; width: 100%; max-height: 0; height: 100%; background-color: rgba(28,28,28,.9); z-index: 99; overflow: hidden; -webkit-transition: max-height 0.8s cubic-bezier(0.28, -0.01, 0.06, 0.99); transition: max-height 0.8s cubic-bezier(0.28, -0.01, 0.06, 0.99); }
.nav-overlay .nav-wrap { position: relative; height: 100%; text-align: center; }
.nav-overlay .nav-list { position: absolute; top: 50%; left: 50%; width: 80%; transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
.nav-overlay .nav-list li { display: block; }
.nav-overlay .nav-list li a { display: inline-block; min-width: 40%; font-size: 3.79vmin; color: #fff; padding: 6.8vmin 4.43vmin; border-bottom: 0.24vmin solid #b79d62; }

.isOpen .nav-overlay { max-height: 100%; height: 100%; }

/* Gotop */
.gotop { position: fixed; bottom: 2%; right: 2%; background: #333; padding: 15px 12px; border-radius: 50px; cursor: pointer; z-index: 100; opacity: 0; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.gotop.show { opacity: 1 }

/*
  首頁
================================================================== */
.main-banner img { vertical-align: top; }

/* 輪播 */
.slider-wrapper { position: relative; width: 100%; overflow: hidden; }
.slider-stage.init > li { position: absolute; }
.slider-stage > li { position: relative; float: left; }
.slider-stage img { vertical-align: top; max-width: 100%; }

/* 輪播-Arrow */
.slider-wrapper .bannerBtn > i { position: absolute; top: 50%; height: 55px; width: 55px; background-size: cover; background-repeat: no-repeat; cursor: pointer; -webkit-transform: translate(0,-50%); -o-transform: translate(0,-50%); transform: translate(0,-50%); -webkit-transition: .25s; -o-transition: .25s; transition: .25s; z-index: 10; }
.slider-wrapper .bannerBtn > i.next-btn { right: 2%; background-image: url(../images/home/next_btn.png); }
.slider-wrapper .bannerBtn > i.prev-btn { left: 2%; background-image: url(../images/home/prev_btn.png); }

/* 輪播-Slogan */
.slider-stage > li .show-txt { position: absolute; top: 50%; left: 50%; width: 80%; text-align: center; -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%);transform: translate(-50%,-50%); }
.slider-stage > li .show-txt h3 { display: inline-block; color: #fff; font-size: 50px; font-weight: 700; text-shadow: 0 0 10px rgba(0,0,0,0.5); text-transform: uppercase; -webkit-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: .5s; -o-transition: .5s; transition: .5s; -webkit-transition-delay: .6s; -o-transition-delay: .6s; transition-delay: .6s; }
.slider-stage > li.enable .show-txt h3 { -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); }

/* 輪播-Dot */
.slider-wrapper .bannerDot { position: absolute; bottom: 6%; left: 0; width: 100%; text-align: center; }
.slider-wrapper .bannerDot > i { display: inline-block; width: 16px; height: 16px; background: #fff; border-radius: 50%; border: 2px solid white; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.slider-wrapper .bannerDot > i + i { margin-left: 30px; }
.slider-wrapper .bannerDot > i.enable { background: transparent; }

.mbView-box { display: none; }

.company-area { background: #ccb37a; }
.company-area > ul { display: table; width: 1200px; margin: 0 auto; padding: 75px 0 60px; }
.company-area > ul > li { opacity: 0; display: table-cell; vertical-align: top; width: calc(100%/3); border-left: 1px solid #000; padding: 0 25px; -webkit-transition: 1.2s; -o-transition: 1.2s; transition: 1.2s; }
.company-area > ul > li:last-child { border-right: 1px solid #000; }
.company-area > ul > li .logo { padding-bottom: 20px; }
.company-area > ul > li .logo img { height: 63px; }
.company-area > ul > li .companyInfo li { font-size: 14px; color: #000; line-height: 1.5; }
.company-area > ul > li .companyInfo li:nth-child(1) { font-size: 16px; font-weight: 700; }
.company-area > ul > li .companyInfo li + li { margin-top: 3px; }
.company-area > ul > li a { display: block; }
.company-area > ul.enterMove li { opacity: 1; }
.company-area > ul > li:nth-child(2) { -webkit-transition-delay: .4s; -o-transition-delay: .4s; transition-delay: .4s; }
.company-area > ul > li:nth-child(3) { -webkit-transition-delay: .8s; -o-transition-delay: .8s; transition-delay: .8s; }

/*
  About
================================================================== */
.aboutArea .mbShow { display: none; }
.aboutArea .pcShow { display: block; }
.aboutArea { height: 84vh; background-color: #1e1e1e; background-image: url(../images/about/about_bg_01.jpg); background-size: cover; background-position: center; }
.aboutArea.manageArea { height: 84vh; background-color: #1e1e1e; background-image: url(../images/about/about_bg_02.jpg); background-size: cover; background-position: center; }
.aboutArea .frame-box { height: 100%; }
.aboutArea .frame-box >* { position: relative; width: 50%; height: 100%; }
.aboutArea .frame-box .left { float: left; }
.aboutArea .frame-box .right { float: right; }

.aboutArea .frame-photo { position: relative; }
.aboutArea .frame-photo img { width: 100%; vertical-align: top; }
.aboutArea .frame-photo .title { position: absolute; color: #fff; text-transform: uppercase; }
.aboutArea .frame-photo .title ._block { display: block; }
.aboutArea .frame-photo.left .title { top: 20%; left: 25%; } 
.aboutArea .frame-photo.left .title .slide_line { position: relative; display: inline-block; }
.aboutArea .frame-photo.left .title .small { font-size: 34px; letter-spacing: 0.25em; } 
.aboutArea .frame-photo.left .title .large { font-size: 80px; margin-top: 15px; letter-spacing: 0.25em; }
.aboutArea .frame-photo.right .title { top: 40%; left: 10%; font-size: 54px; letter-spacing: 0.25em; }

.aboutArea .frame-txt .wrap { position: relative; width: 600px; height: 100%; padding: 100px 0 0 40px; -webkit-transition: 1.5s; -o-transition: 1.5s; transition: 1.5s; }
.aboutArea .right .wrap { transform: translate(200%,0); }
.aboutArea .left .wrap { transform: translate(-200%,0); }

.aboutArea .frame-txt { width: 50%; }
.aboutArea .frame-txt::before { content: ''; position: absolute; top: 0; width: 0; height: 100%; background: rgba(0,0,0,.5); -webkit-transition: 1.3s; -o-transition: 1.3s; transition: 1.3s; }
.aboutArea .frame-txt.right::before { right: 0; }
.aboutArea .frame-txt.left::before { left: 0; }
.aboutArea .frame-txt::before:hover { background: rgba(0,0,0,.7); }

.aboutArea .frame-txt p { font-size: 15px; color: #fff; line-height: 3; }
.aboutArea .frame-txt p + p { margin-top: 15px; }
.aboutArea .frame-txt .heading { display: block; font-size: 26px; color: #b79d62; margin-bottom: 15px; }
.aboutArea .frame-txt .glow-txt { color: #b79d62; }
.aboutArea .frame-txt.left .wrap { float: right; padding: 110px 40px 40px 0; }

/* Title-Line */
.line-heading { text-align: center; overflow: hidden; }
.line-heading span { position: relative; font-size: 20px; color: #000; padding: 0 15px; }
.line-heading span::before, 
.line-heading span::after { content: ''; position: absolute; top: 50%; width: 1000%; height: 1px; background: #000; transform: translate(0,-50%); -o-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); }
.line-heading span::before { left: 100%; }
.line-heading span::after { right: 100%; }
.glow.line-heading span { color: #b79d62; }
.glow.line-heading span::before, .glow.line-heading span::after { background: #b79d62; }
.white.line-heading span { color: #fff; }
.white.line-heading span::before, .white.line-heading span::after { background: #fff; }

/* 設計理念 */
.design-area { background-color: #ccb37a; background-image: url(../images/about/design_bg.png); background-repeat: no-repeat; background-position: right; background-size: auto; padding: 55px 0; overflow: hidden; }
.design-area .wrap { width: 1200px; margin: 0 auto; text-align: center; }
.design-area .logoImg { width: 900px; margin: 35px auto; }
.design-area .logoImg img { max-width: 100% } 
.design-area .symbolImg { opacity: 0;  -webkit-transition: 1s; -o-transition: 1s; transition: 2.3s; transition-delay: .3s; }
.design-area .symbolImg img { -webkit-transition: 2s; -o-transition: 2s; transition: 2s;  }
.design-area .frame-box .heading { font-size: 32px; color: #000; margin: 0 0 30px; transition: 1.8s; transform: translate(0,1000%); }
.design-area .frame-box .pMove { transition: 2s; transform: translate(0,200%); }
.design-area .frame-box p { font-size: 18px; color: #000; text-align: left; line-height: 2.2; }
.design-area .frame-box p + p { margin-top: 15px; }

/* 經營理念 */
.manageArea { padding: 0; }

/* 專業領域 */
.pro-area { background: #2d2d2c; padding: 50px 0 80px; }
.pro-area .wrap { width: 1200px; margin: 0 auto; text-align: center; }
.pro-area .subtitle { font-size: 16px; color: #fff; text-align: left; margin: 25px 0 60px; line-height: 1.8; }

.pro-area .pro-list-box { display: table; width: 100%; }
.pro-area .pro-list-box > li { display: table-cell; vertical-align: top; width: calc(100%/3); padding: 0 2%; }
.pro-area .pro-list-box > li + li { border-left: 1px solid #b79d62; }
.pro-area .pro-list-box > li >* { float: left; }
.pro-area .pro-list-box > li .title { font-size: 22px; color: #b79d62; width: 35%; text-align: left; }

.pro-area .pro-list-box .field-list { padding-left: 20px; }
.pro-area .pro-list-box .field-list li { position: relative; font-size: 15px; color: #fff; text-align: left; }
.pro-area .pro-list-box .field-list li + li { margin-top: 15px; }
.pro-area .pro-list-box .field-list li span { position: relative; display: block; }
.pro-area .pro-list-box .field-list li span:first-child::before { content: ''; position: absolute; top: 50%; left: -13px; width: 2px; height: 2px; border-radius: 50%; background: #fff; transform: translate(0,-50%); -o-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); }
.pro-area .pro-list-box .field-list li span + span { margin-top: 15px; }

/* About-滑動效果 */
.enterMove .frame-txt::before { width: 100%; }
.enterMove .frame-txt .wrap { transform: translate(0,0); }
.enterMove .symbolImg { position: relative; opacity: 1; }
.enterMove .frame-box .heading  { transform: translate(0,0); }
.enterMove .frame-box .pMove { transform: translate(0,0); }


.slide_line .hide { -webkit-transition: all 0s 1s ease; -moz-transition: all 0s 1s ease; transition: all 0s 1s ease; opacity: 0; }
.slide_line.enterMove .hide { opacity: 1; }
.slide_line:after { display: inline; content: ''; position: absolute; z-index: 2; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scaleX(0); transform: scaleX(0); background: #b79d62; }
.slide_line.enterMove:after { animation: slide_line 1.5s ease 0.2s running; }


@keyframes slide_line {
	0%	{ 
		-webkit-transform-origin: left center;
		transform-origin: left center;
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
	50% {
		-webkit-transform-origin: left center;
		transform-origin: left center;
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	50.001% {
		-webkit-transform-origin: right center;
		transform-origin: right center;
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	100% {
		-webkit-transform-origin: right center;
		transform-origin: right center;
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
}

@-webkit-keyframes slide_line {
	0%	{ 
		-webkit-transform-origin: left center;
		transform-origin: left center;
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
	50% {
		-webkit-transform-origin: left center;
		transform-origin: left center;
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	50.001% {
		-webkit-transform-origin: right center;
		transform-origin: right center;
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	100% {
		-webkit-transform-origin: right center;
		transform-origin: right center;
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
}

/*
  Contact
================================================================== */
.contact-main { width: 100%; height: 73vh; background-image: url(../images/contact/pc_contact_banner.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.contact-main .wrap { position: relative; width: 1200px; height: 100%; margin: 0 auto; }
.contact-main .contactWay-box { position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
.contact-main .contactWay-box .topHead { width: 30%; margin: 0 auto 80px auto; text-align: center; }
.contact-main .contactWay-list { width: 100%; text-align: center; }
.contact-main .contactWay-list li { position: relative; display: inline-block; vertical-align: middle; width: 10%; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.contact-main .contactWay-list li a { display: block; }
.contact-main .contactWay-list li.string { width: 19%; color: transparent; }
.contact-main .contactWay-list li .contact-logo { width: 90px; height: 90px; background-repeat: no-repeat; background-size: cover; margin: 0 auto; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.contact-main .contactWay-list li.fb .contact-logo { background-image: url(../images/contact/contact_fb.png); }
.contact-main .contactWay-list li.line .contact-logo { background-image: url(../images/contact/contact_line.png); }
.contact-main .contactWay-list li.ig .contact-logo { background-image: url(../images/contact/contact_ig.png); }
.contact-main .contactWay-list li.mail .contact-logo { background-image: url(../images/contact/contact_mail.png); }

.contact-main .contactWay-list li .contact-name { font-size: 18px; color: #ddd; text-transform: uppercase; margin-top: 15px; }
.contact-main .contactWay-list li.string::before { content: ''; position: absolute; top: 36%; right: 0; width: 100%; height: 1px; background: #fff; }

.contact-footer { background: url(../images/contact/map.jpg) center no-repeat; padding: 110px 0; }
.contact-footer .contact-company { display: table; margin: 0 auto; }
.contact-footer .contact-company > li { display: none; text-align: center; }
.contact-footer .contact-company > li:nth-child(1) { display: block; }
.contact-footer .contact-company > li > a > * { display: table-cell; vertical-align: top; padding: 0 25px; }
.contact-footer .contact-company > li .logo { width: 280px; }
.contact-footer .contact-company > li .logo img { width: 100%; }
.contact-footer .contact-company > li .companyInfo { border-left: 1px solid #b79d62; }
.contact-footer .contact-company > li .companyInfo li { font-size: 16px; color: #000; text-align: left; }
.contact-footer .contact-company > li .companyInfo li + li { margin-top: 10px; }
.contact-footer .contact-company > li .companyInfo li:nth-child(1) { font-size: 22px; color: #b79d62; }

.mbmap { display: none; }

/*
  Process
================================================================== */
.process-main { padding: 65px 0 100px; width: 100%; height: 1000px; background-image: url(../images/process/process_banner.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.process-main .wrap { position: relative; width: 1200px; /*height: 100%; */margin: 0 auto; }
.process-main .process-box .topHead { margin-bottom: 25px; }
.process-main .process-list li { position: relative; float: left; width: calc(95.5%/4); background: #fff; height: 370px; padding: 25px; border-bottom: 8px solid #b79d62; margin-bottom: 50px; overflow: hidden; }
.process-main .process-list li + li { margin-left: 1.5%; }
.process-main .process-list li:nth-child(4n+1) { margin-left: 0; }
.process-main .process-list li::before { content: ''; position: absolute; bottom: -85px; left: -35px; font-family: Arial; font-size: 360px; font-weight: 700; color: #ececec; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; }
.process-main .process-list li:nth-child(1)::before { content: '1'; }
.process-main .process-list li:nth-child(2)::before { content: '2'; }
.process-main .process-list li:nth-child(3)::before { content: '3'; }
.process-main .process-list li:nth-child(4)::before { content: '4'; }
.process-main .process-list li:nth-child(5)::before { content: '5'; }
.process-main .process-list li:nth-child(6)::before { content: '6'; }
.process-main .process-list li:nth-child(7)::before { content: '7'; }
.process-main .process-list li:nth-child(8)::before { content: '8'; color: #474747; }
.process-main .process-list li .heading { position: relative; font-size: 26px; color: #b79d62; font-weight: 700; margin-bottom: 15px; letter-spacing: 0.05em; }
.process-main .process-list li .narrs { position: relative; font-size: 18px; color: #000; line-height: 1.5; letter-spacing: 0.1em; }
.process-main .process-list li .arrow { position: absolute; bottom: 10px; right: 20px; width: 33px; height: 54px; background-image: url(../images/process/arrow.png); background-size: cover; background-repeat: no-repeat; }
.process-main .process-list li:nth-child(1) .arrow { width: 59px; height: 54px; background-image: url(../images/process/double_arrow.png) }
.process-main .process-list li:last-child { background: #333; }
.process-main .process-list li:last-child .narrs { color: #fff; }
.process-main .process-list li .end { position: absolute; bottom: 20px; right: 25px; width: 71px; height: 30px; background-image: url(../images/process/end.png); background-size: cover; background-repeat: no-repeat; }
.process-main .process-list li:nth-child(4) .arrow { display: none; }

.process-sec .wrap { position: relative; top: -34px; width: 1200px; margin: 0 auto; }
.process-sec .range-box { position: relative; text-align: center; margin-bottom: 35px; }
.process-sec .range-box .heading { font-size: 26px; color: #b79d62; background: #333; line-height: 68px; }
.process-sec .range-box .range-list { background: #b79d62; padding: 20px 20px 5px; }
.process-sec .range-box .range-list li { position: relative; display: inline-block; font-size: 18px; color: #fff; margin-bottom: 15px; }
.process-sec .range-box .range-list li + li { margin-left: 20px; }
.process-sec .range-box .range-list li + li::before { content: '/'; position: absolute; top: 0; left: -15px; font-size: 19px; color: #000; font-weight: 700; }

.process-sec .follow-box .mbView.follow-list { display: none; }
.process-sec .follow-box .follow-list { display: table; width: 100%; }
.process-sec .follow-box .follow-list .css-td { display: table-cell; vertical-align: top; width: 25%; padding: 40px 0; border-bottom: 2px solid #b79d62; }
.process-sec .follow-box .follow-list .title { font-size: 26px; color: #b79d62; margin-bottom: 15px; }
.process-sec .follow-box .follow-list li { position: relative; font-size: 16px; color: #666; }
.process-sec .follow-box .follow-list li + li { margin-top: 12px; }

.process-sec .follow-box .follow-list li span { display: table-cell; width: 15px; vertical-align: top; }
.process-sec .follow-box .follow-list li i { display: inline-block; width: 2px; height: 2px; border-radius: 50%; background: #666; }
.process-sec .follow-box .follow-list li h3 { display: table-cell; padding-right: 15px; line-height: 1.5; } 

/*
  Team
================================================================== */
.teamHalf-bg { background: #eaeaea; padding: 0 0 50px; }
.teamHalf-bg .gray-bg { position: relative; padding: 40px 0 50px; }
.teamHalf-bg .gray-bg::before { content: ''; position: absolute; top: 0; left: 53%; height: 100%; width: 47%; background: #c6c6c6; }
.teamHalf-bg .gray-bg::after { content: ''; position: absolute; bottom: 0; left: 25%; height: 25px; width: 75%; background: #c6c6c6; }
.team-list { position: relative; width: 970px; margin: 0 auto; }
.team-list::before { content: ''; position: absolute; top: 25px; left: -25px; width: 63%; height: 100%; background: url(../images/team/team_dot.jpg) repeat; } 
.team-list > li { position: relative; padding: 45px 50px; background: #fff; }
.team-list > li + li { margin-top: 50px; }
.team-list .mbView { display: none; }
.team-list .heading { margin-bottom: 30px; }
.team-list .heading h1 { font-size: 28px; color: #333; font-weight: 700; letter-spacing: 0.05em; margin-bottom: 12px; }
.team-list .heading h3 { font-size: 18px; color: #b79d62; margin-bottom: 5px; }
.team-list .heading h4 { font-size: 20px; font-weight: 700; color: #b79d62;}
.team-list .heading h4 span { font-size: 14px; margin-left: 15px; color: #b79d62; text-transform:uppercase; }

.team-list .person-box > * { float: left; }
.team-list .person-box .personView { width: 28%; }
.team-list .person-box .personView img { width: 100%; vertical-align: top; }
.team-list .person-box .record-list { width: 72%; padding-left: 40px; }
.team-list .person-box .record-list > li { font-size: 14px; color: #666; }
.team-list .person-box .record-list > li + li { margin-top: 35px; }
.team-list .person-box .record-list > li .title { font-size: 18px; font-weight: 700; letter-spacing: 0.3em; margin-bottom: 10px; }
.team-list .person-box .record-list > li div { margin-bottom: 12px; }
.team-list .person-box .record-list > li div:last-child { margin-bottom: 0; }
.team-list .person-box .record-list > li div span { font-size: 12px; margin: 0 10px; }

/*
  News
================================================================== */
.newsArea { background: #eee; padding-top: 60px; }
.newsArea .news-box { width: 1200px; min-height: 700px; margin: 0 auto; background: #fff; padding: 30px 35px; }
.news-tab-list { float: left; width: 20%; }
.news-tab-list li { position: relative; font-size: 18px; color: #333; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 18px 22px 18px 0; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.news-tab-list li::before { opacity: 0; content: ''; position: absolute; top: 50%; right: 10%; width: 12px; height: 21px; background: url(../images/news_arrow.png); transform: translate(0,-50%); -o-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.news-tab-list li.enable { color: #b79d62; }
.news-tab-list li.enable::before { opacity: 1; right: 2%; }
.news-content { position: relative; margin-left: 20%; width: 80%; }
.news-content > div { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; z-index: -1; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.news-content > div.enable { position: relative; opacity: 1; z-index: 1; }

.newsInfo { margin-left: 30px; }
.newsInfo > li { margin-bottom: 5px; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; overflow: hidden; }
.newsInfo .newsHead { position: relative; height: 60px; cursor: pointer; }
.newsInfo .newsHead::before { content: ''; position: absolute; bottom: 0; left: 0; width: 91%; height: 1px; background: #b79d62; }
.newsInfo .newsHead > * { float: left; font-size: 18px; color: #666; }
.newsInfo .newsHead .title { width: 75%; line-height: 60px; padding: 0 0 0 30px; overflow: hidden; text-overflow : ellipsis; white-space: nowrap; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.newsInfo .newsHead .date { width: 18%; line-height: 60px; text-align: center; }
.newsInfo .newsHead .arrow { position: relative; width: 7%; height: 100%; background: #b79d62; text-align: center; cursor: pointer; }
.newsInfo .newsHead .arrow-box { position: relative; top: 50%; display: inline-block; width: 22px; height: 32px; transform: translate(0,-50%); -o-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); } 
.newsInfo .newsHead .arrow-box { transition-timing-function: cubic-bezier(.55,.055,.675,.19); transition-duration: 75ms; }
.newsInfo .newsHead .arrow-box::before,
.newsInfo .newsHead .arrow-box::after { content: ''; display: block; position: absolute; background: #fff; width: 100%; height: 3px; transition-timing-function: ease; transition-duration: .15s; transition-property: transform; }
.newsInfo .newsHead .arrow-box::before { top: 7px; transition: top 75ms ease .12s,opacity 75ms ease; transform: rotate(45deg); }
.newsInfo .newsHead .arrow-box::after { bottom: 7px; transition: bottom 75ms ease .12s, transform 75ms cubic-bezier(.55,.055,.675,.19); transform: rotate(-45deg); }

.newsInfo .newsBody { position: relative; padding: 15px 0; opacity: 0; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; -webkit-transition-delay: .15s; -o-transition-delay: .15s; transition-delay: .15s; }

.newsInfo>li.enable .newsHead .title { padding: 0; }
.newsInfo>li.enable .newsHead .arrow-box::before { top: 15px; }
.newsInfo>li.enable .newsHead .arrow-box::after { bottom: 15px; }
.newsInfo>li.enable .newsBody { opacity: 1; }

/*`
  Works
================================================================== */
.worksArea { background: #eee; padding: 120px 0 80px; }
.worksBox { min-height: 600px; }
.worksTab-list { width: 1200px; margin: 0 auto 60px; text-align: center; }
.worksTab-list li { position: relative; /*display: inline-block; */float: left; width: 15%; background: #fff; margin-bottom: 25px; padding: 10px; border-radius: 25px; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } 
.worksTab-list li + li { margin-left: 1.5%; }
.worksTab-list li:nth-child(6n+1) { margin-left: 0; }
.worksTab-list li::before { opacity: 0; content: ''; position: absolute; top: 50%; right: 20%; width: 24px; height: 24px; background-image: url(../images/works/works_hover.png); background-size: cover; background-repeat: no-repeat; transform: translate(0,-50%); -o-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.worksTab-list li.enable { color: #fff; background: #b79d62; }
.worksTab-list li.enable::before { right: 7%; opacity: 1; }

.worksBody-box { position: relative; width: 1200px; margin: 0 auto; }
.worksBody-box .works-list li { display: inline-block; vertical-align: top; width: 28%; margin-bottom: 80px; }
.worksBody-box .works-list li + li { margin-left: calc(15%/2); }
.worksBody-box .works-list li:nth-child(3n+1) { margin-left: 0; }
.worksBody-box .works-list .worksView { position: relative; width: 100%; height: 330px; text-align: center; border-radius: 50%; background: #000; overflow: hidden; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.worksBody-box .works-list .worksView .viewImg a { position: relative; display: block; }
.worksBody-box .works-list .worksView .viewImg a:first-child { z-index: 1; }
.worksBody-box .works-list .worksView .viewImg a:first-child img { display: block; }
.worksBody-box .works-list .worksView .viewImg a img { display: none; }
.worksBody-box .works-list .worksView .viewImg img { width: 100%; -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.worksBody-box .works-list .worksView .viewImg img { z-index: 1; }
.worksBody-box .works-list .worksView .more { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 1; }
.worksBody-box .works-list .worksView .more span { display: block; width: 100%; font-size: 25px; color: #fff; font-weight: 700; margin-top: 10px; letter-spacing: 0.1em; }
.worksBody-box .works-list .worksView .more > div { -webkit-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }

.worksBody-box .works-list .worksName { margin-top: 20px; font-size: 18px; color: #606060; text-align: center; }
.worksBody-box .works-list .worksName span { position: relative; display: inline-block; min-width: 45%; border: 2px solid transparent; padding: 6px 25px; border-radius: 50px; overflow: hidden; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }

.worksBody-box > div { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; z-index: -1; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.worksBody-box > div.enable { position: relative; opacity: 1; z-index: 1; }
/*
  Footer
================================================================== */
footer { position: relative; text-align: center; background: #b79d62; }
footer .wrap { position: relative; font-size: 14px; color: #fff; margin: 0 auto; padding: 35px 0; }

/*
  無資料
================================================================== */
.nodata { text-align: center; }

/*
  Loading
================================================================== */
.loading { position: fixed; top: 0; left: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0,0,0,1); z-index: 1000; }
.sk-folding-cube { position: absolute; top: 50%; left: 50%; margin: 20px auto; width: 40px; height: 40px; -webkit-transform: translate(-50%,-50%) rotateZ(45deg); transform: translate(-50%,-100%) rotateZ(45deg); }
.sk-folding-cube .sk-cube {
  float: left;
  width: 50%;
  height: 50%;
  position: relative;
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1); 
}
.sk-folding-cube .sk-cube:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ccc;
  -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
          animation: sk-foldCubeAngle 2.4s infinite linear both;
  -webkit-transform-origin: 100% 100%;
      -ms-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}
.sk-folding-cube .sk-cube2 {
  -webkit-transform: scale(1.1) rotateZ(90deg);
          transform: scale(1.1) rotateZ(90deg);
}
.sk-folding-cube .sk-cube3 {
  -webkit-transform: scale(1.1) rotateZ(180deg);
          transform: scale(1.1) rotateZ(180deg);
}
.sk-folding-cube .sk-cube4 {
  -webkit-transform: scale(1.1) rotateZ(270deg);
          transform: scale(1.1) rotateZ(270deg);
}
.sk-folding-cube .sk-cube2:before {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.sk-folding-cube .sk-cube3:before {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s; 
}
.sk-folding-cube .sk-cube4:before {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}
@-webkit-keyframes sk-foldCubeAngle {
  0%, 10% {
    -webkit-transform: perspective(140px) rotateX(-180deg);
            transform: perspective(140px) rotateX(-180deg);
    opacity: 0; 
  } 25%, 75% {
    -webkit-transform: perspective(140px) rotateX(0deg);
            transform: perspective(140px) rotateX(0deg);
    opacity: 1; 
  } 90%, 100% {
    -webkit-transform: perspective(140px) rotateY(180deg);
            transform: perspective(140px) rotateY(180deg);
    opacity: 0; 
  } 
}

@keyframes sk-foldCubeAngle {
  0%, 10% {
    -webkit-transform: perspective(140px) rotateX(-180deg);
            transform: perspective(140px) rotateX(-180deg);
    opacity: 0; 
  } 25%, 75% {
    -webkit-transform: perspective(140px) rotateX(0deg);
            transform: perspective(140px) rotateX(0deg);
    opacity: 1; 
  } 90%, 100% {
    -webkit-transform: perspective(140px) rotateY(180deg);
            transform: perspective(140px) rotateY(180deg);
    opacity: 0; 
  }
}

/*
  RWD
================================================================== */
@media(max-width: 1600px){
	header nav > ul { width: 100%; padding: 0 2%; }
	.aboutArea .frame-photo.left .title .small { font-size: 1.8vw; }
	.aboutArea .frame-photo.left .title .large { font-size: 4.2vw; margin-top: 1vw; }
}

@media(max-width: 1400px){
	.design-area { background-position: bottom right; background-size: 90%; }

	/* Process */
	.process-main .wrap { width: 90%; }
	.process-main .process-list li { padding: 1.5vw; }
	.process-main .process-list li::before { font-size: 25vw; }
	.process-main .process-list li .heading { font-size: 1.8vw; margin-bottom: 1vw; }
	.process-main .process-list li .narrs { font-size: 1.35vw; }

	.process-sec .wrap { width: 90%; }

}
@media(max-width: 1300px){
	/* Gotop*/
	.gotop { -webkit-transform: scale(0.85); -o-transform: scale(0.85); transform: scale(0.85); }

	/* Home */
	.slider-wrapper .bannerBtn > i { height: 4vw; width: 4vw; }
	.slider-stage > li .show-txt h3 { font-size: 3.2vw }
	.company-area > ul { width: 90%; }
	
	/* About */	
	.aboutArea .frame-txt .wrap { width: 90%; padding: 10% 0 0 8%; }
	.aboutArea .frame-txt.left .wrap { padding: 10% 6% 6% 0; }
	.aboutArea .frame-photo.left .title .small { font-size: 2.2vw; }
	.aboutArea .frame-photo.left .title .large { font-size: 5vw; }
	.aboutArea .frame-txt .heading { font-size: 1.6vw; }
	.aboutArea .frame-txt p { font-size: 1.15vw; }
	.aboutArea .frame-txt p + p { margin-top: 1vw; }
	.aboutArea .frame-photo.right .title { font-size: 3.5vw; }	
	
	.design-area .wrap { width: 100%; }
	.design-area .m-wrap { width: 90%; margin: 0 auto; }
	.design-area .frame-box .heading { font-size: 2.5vw; margin: 1vw 0 3vw; }
	.design-area .frame-box p { font-size: 1.5vw; }
	.design-area .frame-box p + p { margin-top: 1.5vw; }

	.pro-area .wrap { width: 100%; }
	.pro-area .m-wrap { width: 90%; margin: 0 auto; }

	.contact-main .wrap { width: 90%; }
	
	/* News */
	.newsArea .news-box { width: 95%; }

	/* Team */
	.team-list { width: 90%; }

	/* Works */
	.worksTab-list { width: 90%; }
	.worksTab-list li::before { width: 1.55vw; height: 1.55vw; }

	.worksBody-box { width: 90%; }
	.worksBody-box .works-list li { width: 30%; }
	.worksBody-box .works-list li + li { margin-left: calc(9%/2); }
	.worksBody-box .works-list .worksView { width: 26.6vw; height: 26.6vw; }
	.worksBody-box .works-list .worksName { font-size: 1.8vw; }

	/* Process */
	.process-main .wrap { width: 95%; }
	.process-sec .wrap { width: 95%; }
}
@media(max-width: 1200px){
	.pro-area .pro-list-box > li { padding: 0 1% 0 2% }
	.pro-area .pro-list-box > li .title { font-size: 1.85vw; width: 32%; }
	.pro-area .pro-list-box .field-list li { font-size: 1.5vw; }

	/* Works */
	.worksArea { padding: 100px 0 80px; }
}
@media(max-width: 996px){	
	/* Gotop*/
	.gotop { display: none; }

	/* Home */
	header { position: fixed; height: 17.5vmin; padding: 2.4vmin; }
	header .logo { display: block; width: 80%; height: auto; padding: 0; text-align: left; }
	header .logo img { width: 40vmin; height: 12.8vmin; }
	header nav.pc-view { display: none; }
	.hamburger-box { opacity: 1 }
	header.change .hamburger-box { opacity: 1;transform: translate(0,-50%); -o-transform: translate(0,-50%); -webkit-transform: translate(0,-50%); }

	content { padding-top: 17.5vmin; }
	footer .wrap { font-size: 2.4vmin; padding: 6.8vmin 0; }

	.pcView-box { display: none; }
	.mbView-box { display: block; background: #ccc; width: 100%; height: 160.48vmin; }
	.mbView-box .slider-stage img { width: 100%; height: 160.48vmin; }
	.slider-stage > li .show-txt { width: 90%; }
	.slider-stage > li .show-txt h3 { font-size: 5.96vmin; }
	.slider-wrapper .bannerBtn > i { top: 75%; width: 11.93vmin; height: 11.93vmin; }
	.slider-wrapper .bannerDot > i { width: 2.98vmin; height: 2.98vmin; }
	.slider-wrapper .bannerDot > i + i { margin-left: 8vmin; }

	.company-area > ul { display: block; width: 100%; padding: 8.5vmin 0; }
	.company-area > ul > li { display: inline-block; width: 100%; border-left: none; padding: 0 8%; }
	.company-area > ul > li + li { margin-top: 6vmin; }
	.company-area > ul > li >* { display: block; }
	.company-area > ul > li .logo { width: 23.8vmin; padding-bottom: 4vmin; }
	.company-area > ul > li .logo img { width: 100%; height: auto; }
	.company-area > ul > li .companyInfo li { font-size: 3vmin; }
	.company-area > ul > li .companyInfo li + li { margin-top: 1.3vmin; }
	.company-area > ul > li .companyInfo li:nth-child(1) { font-size: 3.9vmin; }
	
	/* About */
	.aboutArea .frame-box .moveTxt { width: 100%; }

	.aboutArea { height: auto; background-image: none; }
	.aboutArea .frame-box >* { display: block; width: 100%;	}
	.aboutArea .mbShow { display: block; }
	.aboutArea .pcShow { display: none; } 
	.aboutArea .frame-photo.left .title { top: 50%; right: auto; left: 50%; transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
	.aboutArea .frame-photo.left .title .small { font-size: 4.35vmin; }
	
	.aboutArea .frame-txt::before { background: none; }
	.aboutArea .frame-txt .wrap { width: 85%; padding: 6.4vmin 0; margin: 0 auto; }
	.aboutArea .frame-txt.left .wrap { float: initial; width: 85%; padding: 6.4vmin 0; margin: 0 auto; }
	.aboutArea .frame-txt .heading { font-size: 3.2vmin; margin-bottom: 2.4vmin; }
	.aboutArea .frame-txt p { font-size: 2.4vmin; line-height: 2.2; }
	.aboutArea .frame-txt p + p { margin-top: 4vmin; }
	.aboutArea .frame-photo.right .title { font-size: 4.35vmin; top: 50%; left: 50%; transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
	
	.line-heading span { font-size: 3.2vmin; padding: 0 2vmin; }
	.design-area { padding: 6.4vmin 0; background-position: 480% 30%; background-size: 95%; }
	.design-area .m-wrap { width: 85%; }
	.design-area .logoImg { width: 85vmin; margin: 4vmin 0 2.4vmin; }
	.design-area .logoImg img { width: 100%; }
	.design-area .symbolImg img { width: 45.6vmin; height: 40vmin; }
	.design-area .frame-box .heading { font-size: 5.4vmin; margin: 2.4vmin 0 7vmin; }
	.design-area .frame-box p { font-size: 2.4vmin; }
	.design-area .frame-box p + p { margin-top: 4vmin; }

	.pro-area .subtitle { font-size: 2.4vmin; margin: 5.6vmin 0 10.4vmin; }
	.pro-area .pro-list-box { display: block; }
	.pro-area .pro-list-box > li { display: inline-block; width: 100%; }
	.pro-area .pro-list-box > li + li { border: none; margin-top: 8vmin; }
	.pro-area .pro-list-box > li >* { float: initial; display: inline-block; vertical-align: top; }
	.pro-area .pro-list-box > li .title { font-size: 3.36vmin; width: 20%; }
	.pro-area .pro-list-box .field-list li { font-size: 3.04vmin; }
	.pro-area .pro-list-box .field-list li + li { margin-top: 3.6vmin; }

	.contact-footer { background: none; padding: 8vmin 0; }
	.contact-footer .contact-company > li { display: block; }
	.contact-footer .contact-company > li + li { margin-top: 8.8vmin; }
	.contact-footer .contact-company > li > a > * { display: block; padding: 0; }
	.contact-footer .contact-company > li .logo { width: 28.8vmin; }
	.contact-footer .contact-company > li .companyInfo { margin-top: 3.4vmin; padding-left: 3.2vmin; }
	.contact-footer .contact-company > li .companyInfo li { font-size: 3vmin; }
	.contact-footer .contact-company > li .companyInfo li:nth-child(1) { font-size: 4vmin; }
	.contact-footer .contact-company > li .companyInfo li + li { margin-top: 1.5vmin; }
	
	.contact-main { height: 107.25vmin; background-image: url(../images/contact/m_contact_banner.jpg); }
	.contact-main .wrap { width: 60vmin; }
	.contact-main .contactWay-box .topHead { display: none; }
	.contact-main .contactWay-list li { width: 35%; }
	.contact-main .contactWay-list li.string { width: 24%; }
	.contact-main .contactWay-list li.string::before { display: none; }
	.contact-main .contactWay-list li:nth-child(4n) { display: none; }
	.contact-main .contactWay-list li .contact-logo { width: 20vmin; height: 20vmin; }
	.contact-main .contactWay-list li .contact-name { font-size: 3.38vmin; margin-top: 4vmin; }
	.contact-main .contactWay-list li:nth-child(1),
	.contact-main .contactWay-list li:nth-child(3) { margin-bottom: 10.88vmin; }
	
	.mbmap { display: block; }
	.mbmap .heading { background: #2d2d2c; text-align: center; font-size: 2.8vmin; color: #fff; padding: 1.5vmin 0; }
	.mbmap .googleMap { height: 68.55vmin; }
	.mbmap .map-size { height: 100%; width: 100%; }

	/* News */
	.newsArea { padding-top: 4vmin; }
	.newsArea .news-box { width: 100%; background: none; padding: 0; }
	.m-newsTab-hidden { height: 14vmin; overflow: hidden; }
	.m-newsTab-scroll { height: 16vmin; padding: 0 3.63vmin; overflow-x: auto; }
	.news-tab-list { float: inherit; width: 100%; text-align: left; }
	.news-tab-list li { /*display: inline-block;*/ float: left; text-align: center; width: 29vmin; background: #fff; padding: 4vmin 0; font-size: 2.58vmin; }
	.news-tab-list li + li { margin-left: 2.4vmin; }
	.news-tab-list li::before { display: none; }

	.news-content { margin: 2.5vmin auto 0; padding: 1.2vmin 0 11.3vmin ; width: 95%; background: #fff; }
	.newsInfo { padding: 0 1.2vmin; margin: 0; }
	.newsInfo .newsHead { height: 11.3vmin; }
	.newsInfo .newsHead > * { font-size: 3.5vmin; }
	.newsInfo .newsHead .title { width: 68%; padding: 0 2vmin; line-height: 11.3vmin; }
	.newsInfo .newsHead .date { width: 22%; line-height: 11.3vmin; text-align: left; }
	.newsInfo .newsHead .arrow { width: 10%; }
	.newsInfo .newsHead .arrow-box { width: 3.25vmin; height: 5.65vmin; }
	.newsInfo .newsHead .arrow-box::before, .newsInfo .newsHead .arrow-box::after { height: 0.65vmin; }
	.newsInfo .newsHead .arrow-box::before { top: 1.45vmin; }
	.newsInfo .newsHead .arrow-box::after { bottom: 1.45vmin; }
	.newsInfo>li.enable .newsHead .arrow-box::before { top: 2.5vmin; }
	.newsInfo>li.enable .newsHead .arrow-box::after { bottom: 2.5vmin; }

	.newsInfo .newsBody { font-size: 2.42vmin; padding: 2.42vmin 0; }
  .newsInfo .newsBody img { width: 100% !important; height: auto !important; }
  
	/* Process */	
	.m-process-bg { position: fixed; width: 100%; height: 100%; background-image: url(../images/process/m_process_bg.jpg); background-size: cover; background-repeat: no-repeat; }
	.m-process-wrapper { position: absolute; top: 17.5vmin; left: 0; z-index: 10; width: 100%; }
	.process-main { background: none; padding: 4vmin 0 12vmin; height: auto; }
	.process-main .wrap { width: 100%; }
	.process-list { width: 90%; margin: 0 auto; }
	.process-main .process-box .topHead { margin-bottom: 3.63vmin; }
	.process-main .process-list li { width: 48%; height: 60vmin; padding: 3.87vmin; }
	.process-main .process-list li + li { margin-left: 4%; }
	.process-main .process-list li:nth-child(2n+1) { margin-left: 0; border-bottom: 1.2vmin solid #b79d62; }
	.process-main .process-list li .heading { font-size: 4.52vmin; margin-bottom: 3vmin; }
	.process-main .process-list li .narrs { font-size: 3.22vmin; }
	.process-main .process-list li::before { font-size: 58vmin; bottom: -16vmin; left: -5.5vmin; }	
	.process-main .process-list li .arrow { bottom: 3.22vmin; right: 3.87vmin; width: 5.65vmin; height: 8.63vmin; }
	.process-main .process-list li:nth-child(1) .arrow { width: 9.44vmin; height: 8.63vmin; }
	.process-main .process-list li:nth-child(4) .arrow { display: block; }
	.process-main .process-list li .end { bottom: 4.68vmin; right: 4vmin; width: 11.69vmin; height: 5vmin; }

	.process-sec .wrap { top: 0; width: 100%; }
	.process-sec .range-box { margin-bottom: 0; }
	.process-sec .range-box .heading { font-size: 4.44vmin; line-height: 13.3vmin; }
	.process-sec .range-box .range-list { padding: 3.23vmin 3.23vmin 1.2vmin; }
	.process-sec .range-box .range-list li { font-size: 3.23vmin; margin-bottom: 2vmin; }
	.process-sec .range-box .range-list li + li { margin-left: 3.63vmin; }
	.process-sec .range-box .range-list li + li::before { font-size: 3.3vmin; left: -2.5vmin; }

	.process-sec .follow-box { background: #eee; padding: 5.24vmin 0; }
	.process-sec .follow-box .pcView.follow-list { display: none; }
	.process-sec .follow-box .mbView.follow-list { display: block; }
	.process-sec .follow-box .follow-list { width: 90%; margin: 0 auto; }
	.process-sec .follow-box .follow-list .css-td { padding: 5vmin 0 5vmin; border-bottom: 0.18px solid #b79d62; }
	.process-sec .follow-box .follow-list .title { font-size: 4vmin; margin-bottom: 3.8vmin; }
	.process-sec .follow-box .follow-list li { font-size: 2.4vmin; }
	.process-sec .follow-box .follow-list li + li { margin-top: 3.22vmin; }
	.process-sec .follow-box .follow-list li span { width: 2vmin; }
	.process-sec .follow-box .follow-list li i { width: 0.3vmin; height: 0.3vmin; }
	.process-sec .follow-box .follow-list li h3 { padding-right: 2vmin; }
	
	/* Team */
	.teamHalf-bg { padding: 0 }
	.teamHalf-bg .gray-bg { padding: 12vmin 0; }
	.teamHalf-bg .gray-bg::before,
	.teamHalf-bg .gray-bg::after { display: none; }
	.team-list { width: 80%; }
	.team-list::before { display: none; }
	.team-list > li { padding: 0; border: none; background: none; }
	.team-list > li + li { margin-top: 13vmin }
	.team-list .person-box > * { display: block; width: 100%; }
	.team-list .person-box .personView { width: 75%; border: 1px solid #b79d62; }
	.team-list .person-box .record-list { width: 100%; padding-left: 0; }
	.team-list .pcView { display: none; }
	.team-list .mbView { display: block; }
	.team-list .mbView.heading h1 { font-size: 3.6vmin; margin-bottom: 1.2vmin; }
	.team-list .mbView.heading h3 { font-size: 2.8vmin; margin-bottom: 2.41vmin; }
	.team-list .mbView.heading h3 div { display: block; font-size: 3.5vmin; margin-top: 0.8vmin; font-weight: 700; }
	.team-list .mbView.heading h3 div span { font-size: 2.42vmin; text-transform: uppercase; }
	.team-list .heading { margin-bottom: 2.42vmin; }

	.team-list .person-box .record-list { margin-top: 3.5vmin; }
	.team-list .person-box .record-list > li { font-size: 3.2vmin; }
	.team-list .person-box .record-list > li .title { font-size: 3.6vmin; }
	.team-list .person-box .record-list > li div { margin-bottom: 1.8vmin; }
	.team-list .person-box .record-list > li .title { margin-bottom: 1.8vmin; }
	.team-list .person-box .record-list > li + li { margin-top: 5.2vmin; }
	.team-list .person-box .record-list > li:nth-child(2) { margin-top: 0; }
	.team-list .person-box .record-list > li div span { font-size: 2.65vmin; margin: 0 2vmin; }

	/* Works */
	.worksArea { padding: 3.63vmin 0; }
	.m-worksTab-hidden { height: 8.65vmin; overflow: hidden; }
	.m-worksTab-scroll { height: 10.65vmin; padding: 0 3.63vmin; overflow-x: auto; }
	.worksTab-list { text-align: left; margin: 0 auto; }
	.worksTab-list li { font-size: 2.82vmin; width: 30vmin; margin-bottom: 0; text-align: center; padding: 1.45vmin 3.5vmin; }
	.worksTab-list li::before { width: 2.82vmin; height: 2.82vmin; }
	.worksTab-list li + li { margin-left: 2.4vmin; }
	.worksTab-list li:nth-child(6n+1) { margin-left: 2.4vmin; }
	.worksTab-list li:nth-child(1) { margin-left: 0; }
	.worksTab-list li.enable::before { right: 6%; }

	.worksBody-box { width: 80%; text-align: left; margin-top: 6vmin; }
	.worksBody-box .works-list li { width: 40vmin; margin-bottom: 10vmin; }
	.worksBody-box .works-list li + li { margin-left: 0; }
	.worksBody-box .works-list li:nth-child(2n) { margin-left: 10vmin; }

	.worksBody-box .works-list .worksView { width: 40vmin; height: 40vmin; }
	.worksBody-box .works-list .worksName { font-size: 2.58vmin; margin-top: 4vmin; }
	.worksBody-box .works-list .worksName span { padding: 0; }
}

@media(max-width: 965px){
	/* Works */	
	.worksBody-box .works-list li { width: 36vmin; }
	.worksBody-box .works-list li:nth-child(2n) { margin-left: 6vmin; }
	.worksBody-box .works-list .worksView { width: 36vmin; height: 36vmin; }
}

@media(max-width: 400px){
	.team-list { width: 85%; }
}

@media(min-width: 997px){
	.gotop:hover { background: #fff; }
	/* Home */
	.slider-wrapper .bannerBtn > i.next-btn:hover { background-image: url(../images/home/next_btn_h.png); }
	.slider-wrapper .bannerBtn > i.prev-btn:hover { background-image: url(../images/home/prev_btn_h.png); }
	.slider-wrapper .bannerDot > i:hover { background: transparent; }
	
	/* About */
	.design-area .symbolImg img:hover { transform: scale(1.1); }

	/* News */
	.news-tab-list li:hover { color: #b79d62; }
	.news-tab-list li:hover::before { opacity: 1; right: 2%; }

	/* Process */
	.process-main .process-list li:hover::before { -webkit-transform: scale(1.25); -o-transform: scale(1.25); transform: scale(1.25); }
	
	/* Works */
	.worksTab-list li:hover { color: #fff; background: #b79d62; }
	.worksTab-list li:hover::before { right: 7%; opacity: 1; }
	.worksBody-box .works-list li:hover .worksView .viewImg img { opacity: 0.8; -webkit-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); }
	.worksBody-box .works-list li:hover .worksName span { background: #fff; border: 2px solid #b79d62; }

	/* Contant */
	.contact-main .contactWay-list li:hover.fb .contact-logo { background-image: url(../images/contact/contact_fb_h.png); }
	.contact-main .contactWay-list li:hover.line .contact-logo { background-image: url(../images/contact/contact_line_h.png); }
	.contact-main .contactWay-list li:hover.ig .contact-logo { background-image: url(../images/contact/contact_ig_h.png); }
	.contact-main .contactWay-list li:hover.mail .contact-logo { background-image: url(../images/contact/contact_mail_h.png); }
}