/* CSS  */
/* reset section */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin:0; padding:0; border:0; font-size:100%; font:inherit; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style:none; }
ul li{ list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
table {border-collapse:collapse; border-spacing:0;}
img{ border:0; margin:0; padding:0; }
a{text-decoration: none;}
html,body { background:#FFF; -webkit-font-smoothing: antialiased; width:100%; height:100%; }

	@font-face {
	 font-family: 'colognesixty';
		src: url('../fonts/chalet_comprime/chaletcomprime-colognesixty.eot');
		src: url('../fonts/chalet_comprime/chaletcomprime-colognesixty.eot?#iefix') format('embedded-opentype'),
			 url('../fonts/chalet_comprime/chaletcomprime-colognesixty.woff') format('woff'),
			 url('../fonts/chalet_comprime/chaletcomprime-colognesixty.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
	 font-family: 'milansixty';
		src: url('../fonts/chalet_comprime/chaletcomprime-milansixty.eot');
		src: url('../fonts/chalet_comprime/chaletcomprime-milansixty.eot?#iefix') format('embedded-opentype'),
			 url('../fonts/chalet_comprime/chaletcomprime-milansixty.woff') format('woff'),
			 url('../fonts/chalet_comprime/chaletcomprime-milansixty.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}

	@font-face {
	 font-family: 'klavika regular';
		src: url('../fonts/klavika/klavika-regular.eot');
		src: url('../fonts/klavika/klavika-regular.eot?#iefix') format('embedded-opentype'),
			 url('../fonts/klavika/klavika-regular.woff') format('woff'),
			 url('../fonts/klavika/klavika-regular.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
	 font-family: 'klavika medium';
		src: url('../fonts/klavika/klavika-medium.eot');
		src: url('../fonts/klavika/klavika-medium.eot?#iefix') format('embedded-opentype'),
			 url('../fonts/klavika/klavika-medium.woff') format('woff'),
			 url('../fonts/klavika/klavika-medium.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
	 font-family: 'klavika regularitalic';
		src: url('../fonts/klavika/klavika-regularitalic.eot');
		src: url('../fonts/klavika/klavika-regularitalic.eot?#iefix') format('embedded-opentype'),
			 url('../fonts/klavika/klavika-regularitalic.woff') format('woff'),
			 url('../fonts/klavika/klavika-regularitalic.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}

/*********************Home*********************/
#wrapper-home{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#EDEFED; overflow:hidden;}
.footer-home { float:left; position:relative; width:100%; height:30px; background:#ecb7b6; margin-top:-30px; z-index:99; }
.footer-home #toTop { background:url(../images/home_totop.png) no-repeat; }
.footer-home #toTopHover { background:url(../images/home_totop.png) no-repeat; }

.landing{ float:left; width:100%; height:auto; background:#EDEFED; margin-bottom:0;}

.landing-box1{ margin:0 auto; width:auto; max-width:940px; height:auto; max-height:426px; display:block; }
.landing-box2{ float:left; width:100%; height:auto; margin-top:35px; display:none; }

.text-landing-box2{ display:none; }
.content{  margin:0 auto; width:100%; max-width:940px; height:auto; margin-top:0; padding-bottom:60px; }
.content .content-box{ float:left; width:100%; max-width:940px; height:auto; margin-bottom:140px; }
.content .content-box .box1{ float:left; width:38%; /*max-width:439px;*/ height:137px; border-right:solid 1px #FFFFFF; padding-left:2%; margin-bottom:20px; }
.content .content-box .box2{ float:left; width:28%; /*max-width:246px;*/ height:137px; border-right:solid 1px #FFFFFF; border-left:solid 1px #d5ceca; padding-left:2%; margin-bottom:20px; }
.content .content-box .box3{ float:left; width:26%; /*min-width:160px;*/ height:137px; border-left:solid 1px #d5ceca; padding-left:2%; margin-bottom:20px;}

.content .content-box h1{ float:left; width:100%; height:auto; font-family:colognesixty; font-size:22px; line-height:22px; color:#5D4337; margin-bottom:10px; }
.content .content-box p{ float:left; width:95%; height:auto; font-family:klavika regular; font-size:14px; line-height:20px; color:#5D4337;}
.content .content-box span{ font-weight:bold;}
.content .content-box span a{ color:#5D4337; }
.content .content-box .btn{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
.content .content-box .btn a{ color:#FFFFFF; }
.content .content-box .icon{ float:left; width:180px; height:auto;}
.content .content-box .icon img{ float:left; width:28px; height:28px;}
.content .content-box .icon p{ float:left; width:auto; height:28px; line-height:28px; margin-bottom:5px;}
.content .content-box .icon p a{ color:#5D4337; }
.content .content-box .icomoon{ float:left; width:28px; height:28px; font-size:28px; font-weight:normal; margin-right:10px; color:#8AD9C9;}

@media only screen and (max-device-width: 640px) and (orientation : landscape) {
	.content .content-box h1{ float:left; width:100%; height:auto; font-family:colognesixty; font-size:18px; line-height:22px; color:#5D4337; margin-bottom:10px; }
	.content .content-box p{ float:left; width:95%; height:auto; font-family:klavika regular; font-size:14px; line-height:20px; color:#5D4337;}
}


@media screen and (max-width: 960px) and (orientation : portrait) {
.landing{ float:left; width:100%; height:auto; background:#EDEFED; margin-bottom:30px;}
.landing-box1{ margin:0 auto; width:auto; max-width:940px; height:auto; max-height:426px; display:none; }
.landing-box2{ float:left; width:100%; height:auto; margin-top:0; display:block; }


.text-landing-box1{ display:none; }
.text-landing-box2{ margin:0 auto; width:auto; max-width:580px; height:auto; position:relative; margin-top:50px; background:#996600; display:block; }
.text-landing-box2 h1{ float:left; width:auto; max-width:580px; height:auto; font-family:klavika medium; font-size:14px; line-height:20px; color:#5D4337; padding:0 20px;}
.text-landing-box2 h2{ float:left; width:auto; max-width:580px; height:auto; font-family:milansixty; font-size:68px; line-height:68px; padding:0 20px;}
.text-landing-box2 .line1{ color:#E7A0A0; }
.text-landing-box2 .line2{ color:#C5BBBB; }
.text-landing-box2 .line3{ color:#F4D174; }
.text-landing-box2 .line4{ color:#B2E090; }

.content{ margin:0 auto; width:100%; max-width:730px; height:auto; margin-top:30px; padding-bottom:60px; }
.content .content-box{ margin:0 auto; width:100%; max-width:730px; height:auto; margin-bottom:50px; margin-top:0; }
.content .content-box .box1{ float:left; width:40%; /*max-width:260px;*/ height:166px; border-right:solid 1px #FFFFFF; padding-left:10px; margin-bottom:20px;}
.content .content-box .box2{ float:left; width:28%; /*max-width:236px;*/ height:166px; border-right:solid 1px #FFFFFF; border-left:solid 1px #d5ceca; padding-left:2%; margin-bottom:20px;}
.content .content-box .box3{ float:left; width:24%; /*max-width:160px;*/ height:166px; border-left:solid 1px #d5ceca; padding-left:2%;}
.content .content-box h1{ float:left; width:100%; height:auto; font-family:colognesixty; font-size:22px; line-height:22px; color:#5D4337; margin-bottom:10px; margin-bottom:20px;}
.content .content-box p{ float:left; width:95%; height:auto; font-family:klavika regular; font-size:12px; line-height:16px; color:#5D4337;}
.content .content-box span{ font-weight:bold; }
.content .content-box .btn{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
.content .content-box .icon{ float:left; width:160px; height:auto;}
.content .content-box .icon img{ float:left; width:28px; height:28px;}
.content .content-box .icon p{ float:left; width:auto; height:28px; line-height:28px; margin-bottom:5px;}
}

@media screen and (max-width: 560px) and (orientation : portrait) {
#wrapper-home{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#FFF; overflow:hidden;}
.landing{ float:left; width:100%; height:auto; background:#FFF; margin-bottom:30px;}
.landing-box1{ margin:0 auto; width:auto; max-width:940px; height:auto; max-height:426px; display:none; }
.landing-box2{ float:left; width:100%; height:auto; margin-top:0; display:block; }

.text-landing-box1{ display:none; }
.text-landing-box2{ margin:0 auto; width:auto; max-width:314px; height:auto; position:relative; margin-top:20px; background:#FFF; display:block; }
.text-landing-box2 h1{ float:left; width:auto; max-width:314px; height:auto; font-family:klavika medium; font-size:14px; line-height:14px; color:#5D4337; padding:0 10px;}
.text-landing-box2 h2{ float:left; width:auto; max-width:314px; height:auto; font-family:milansixty; font-size:38px; line-height:38px;  padding:0 10px;}

.content{ margin:0 auto; width:100%; max-width:314px; height:auto; padding-bottom:35px; }
.content .content-box{ margin:0 auto; width:100%; max-width:314px; height:auto; margin-bottom:50px;}

.content .content-box .box1{ float:left; width:auto; height:auto; border-right:none; padding-left:0; border-bottom:#d5ceca 1px solid; margin-bottom:15px; padding-bottom:15px; margin-left:15px; margin-right:15px; margin-top:-30px;}
.content .content-box .box2{ float:left; width:auto; height:auto; border-right:none; border-left:none; padding-left:0; border-bottom:#d5ceca 1px solid; margin-bottom:10px; padding-bottom:15px; margin-left:15px; margin-right:15px;}
.content .content-box .box3{ float:left; width:auto; height:auto; border-left:none; padding-left:0; margin-bottom:10px; padding-bottom:15px; margin-left:15px; margin-right:15px;}


.content .content-box h1{ float:left; width:100%; height:auto; font-family:colognesixty; font-size:22px; line-height:22px; color:#5D4337; margin-bottom:10px; }
.content .content-box p{ float:left; width:95%; height:auto; font-family:klavika regular; font-size:12px; line-height:16px; color:#5D4337;}
.content .content-box span{ font-weight:bold; }
.content .content-box .btn{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
.content .content-box .icon{ float:left; width:289px; height:auto;}
.content .content-box .icon img{ float:left; width:28px; height:28px;}
.content .content-box .icon p{ float:left; width:289px; height:28px; line-height:28px; margin-bottom:5px;}
}

/*********************Clients*********************/
#wrapper-clients{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#c2e1ab; overflow:hidden;}
.footer-clients { float:left; position:relative; width:100%; height:30px; background:#c8d9f1; margin-top:-30px; z-index:99; }
.footer-clients #toTop { background:url(../images/clients_totop.png) no-repeat; }
.footer-clients #toTopHover { background:url(../images/clients_totop.png) no-repeat; }

.clients{ margin:0 auto; width:auto; max-width:980px; height:auto;}
.clients .clients-box{ float:left; width:auto; max-width:940px; padding:50px 20px 70px 20px; }
.clients .clients-box h1{ float:left; width:100%; max-width:940px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.clients .clients-box h2{ float:left; width:100%; max-width:940px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.clients .clients-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:30px;}
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:810px; height:auto; }
.clients .clients-box ol li{ float:left; width:105px; height:105px; margin:15px;}
.clients .clients-box ol li img{ width:100%; height:100%; -moz-border-radius: 105px; -webkit-border-radius: 105px; border-radius: 105px;}

@media screen and (max-width: 960px) and (orientation : portrait) {
.clients{ margin:0 auto; width:auto; max-width:715px; height:auto; }
.clients .clients-box{ float:left; width:auto; max-width:675px; padding:50px 20px 70px 20px;}
.clients .clients-box h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.clients .clients-box h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:675px; height:auto; }
.clients .clients-box ol li{ float:left; width:105px; height:105px; margin:15px;}
.clients .clients-box ol li img{ width:100%; height:100%;}
}

@media screen and (max-width: 850px) {
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:675px; height:auto;}
}
@media screen and (max-width: 720px){
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:540px; height:auto;}
}
@media screen and (max-width: 590px){
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:405px; height:auto;}
}
@media screen and (max-width: 450px){
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:300px; height:auto;}
.clients .clients-box ol li{ float:left; width:83px; height:83px; margin:8px;}
}

@media only screen and (max-device-width: 640px) and (orientation : landscape) {
.clients{ margin:0 auto; width:auto; max-width:640px; height:auto; }
.clients .clients-box{ float:left; width:auto; max-width:620px; padding:50px 20px 70px 20px; }
.clients .clients-box h1{ float:left; width:100%; max-width:580px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.clients .clients-box h2{ float:left; width:100%; max-width:580px; height:65px; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; }
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:495px; height:auto;}
.clients .clients-box ol li{ float:left; width:83px; height:83px; margin:8px;}
.clients .clients-box ol li img{ width:100%; height:100%;}
}


@media screen and (max-width: 400px) and (orientation : portrait) {
.clients{ margin:0 auto; width:auto; max-width:320px; height:auto; }
.clients .clients-box{ float:left; width:auto; max-width:300px; padding:30px 10px 60px 10px; }
.clients .clients-box h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.clients .clients-box h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.clients .clients-box ol{ margin:0 auto; width:100%; max-width:300px; height:auto;}
.clients .clients-box ol li{ float:left; width:83px; height:83px; margin:8px;}
.clients .clients-box ol li img{ width:100%; height:100%;}
}

/*********************Our Team*********************/
#wrapper-our-team{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#C7D8F0; overflow:hidden;}
.footer-our-team { float:left; position:relative; width:100%; height:30px; background:#F4B59D; margin-top:-30px; z-index:99; }
.footer-our-team #toTop { background:url(../images/our_team_totop.png) no-repeat; }
.footer-our-team #toTopHover { background:url(../images/our_team_totop.png) no-repeat; }

.our-team{ margin:0 auto; width:auto; max-width:980px; height:auto; }
.our-team .our-team-box{ float:left; width:auto; max-width:940px; padding:50px 20px 70px 20px; }
.our-team .our-team-box h1{ float:left; width:100%; max-width:940px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.our-team .our-team-box h2{ float:left; width:100%; max-width:940px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:20px;}
.our-team .our-team-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:20px;}

.our-team .our-team-box ol{ margin:0 auto; width:auto; max-width:940px; height:auto; }
.our-team .our-team-box ol li{ float:left; width:194px; height:194px; margin:20px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; position:relative; }
.our-team .our-team-box ol li img{ position:absolute; left:0; top:0; width:194px; height:194px; z-index:99; -webkit-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; opacity:0; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px;}
.our-team .our-team-box ol li:hover img{ -webkit-transition: opacity 0.2s ease-out; opacity: 1;}
.our-team .our-team-box .content{ float:left; width:100%; height:auto; padding-top:60px; }
.our-team .our-team-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; text-align:center; margin:0; padding:0;}
.our-team .our-team-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:14px; text-align:center; margin:0; padding:0; margin-bottom:3px;}
.our-team .our-team-box .content p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#FFFFFF; line-height:14px; text-align:center; }

.our-team .our-team-box .none .content{ float:left; width:100%; height:auto; padding-top:55px; }
.our-team .our-team-box .none{ border:5px #FFFFFF solid; width:184px; height:184px; }
.our-team .our-team-box .none h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; text-align:center; margin:0; padding:0;}
.our-team .our-team-box .none h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:14px; text-align:center; margin:0; padding:0; margin-bottom:3px;}
.our-team .our-team-box .none a{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#FFFFFF; line-height:14px; text-align:center; }
.our-team .our-team-box .none a:hover{ color:#5D4337; }

@media screen and (max-width: 975px) {
.our-team .our-team-box ol{ margin:0 auto; width:auto; max-width:702px; height:auto; }
}

@media screen and (max-width: 640px) and (orientation : landscape)  {
.our-team .our-team-box ol{ margin:0 auto; width:auto; max-width:470px; height:auto;}
}

@media screen and (max-width: 960px) and (orientation : portrait) {
.our-team{ margin:0 auto; width:auto; max-width:715px; height:auto; }
.our-team .our-team-box{ float:left; width:auto; max-width:675px; padding:50px 20px 70px 20px;}
.our-team .our-team-box h1{ float:left; width:100%; max-width:675px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.our-team .our-team-box h2{ float:left; width:100%; max-width:675px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:20px;}
.our-team .our-team-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:20px;}
.our-team .our-team-box ol{ margin:0 auto; width:100%; max-width:574px; height:auto; }
.our-team .our-team-box ol li{ float:left; width:247px; height:247px; margin:20px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; position:relative;}
.our-team .our-team-box ol li img{ position:absolute; width:247px; height:247px; z-index:99; -webkit-transition: opacity 0.2s ease-out; opacity:0; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px;}
.our-team .our-team-box ol li:hover img{ -webkit-transition: opacity 0.2s ease-out; opacity: 1;}
.our-team .our-team-box .content{ float:left; width:100%; height:auto; padding-top:50px; }
.our-team .our-team-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.our-team .our-team-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:14px; text-align:center; margin:0; padding:0; margin-bottom:3px;}
.our-team .our-team-box .content p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#FFFFFF; line-height:14px; text-align:center; }
.our-team .our-team-box .none .content{ float:left; width:100%; height:auto; padding-top:40px; }
.our-team .our-team-box .none{ border:5px #FFFFFF solid; width:237px; height:237px; }
.our-team .our-team-box .none h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.our-team .our-team-box .none h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:14px; text-align:center; margin:0; padding:0; margin-bottom:3px;}
.our-team .our-team-box .none a{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#FFFFFF; line-height:14px; text-align:center; }
.our-team .our-team-box .none a:hover{ color:#5D4337; }
}

@media screen and (max-width: 615px) and (orientation : portrait){
.our-team .our-team-box ol{ margin:0 auto; width:auto; max-width:289px; height:auto; }
}

@media screen and (max-width: 400px) and (orientation : portrait) {
.our-team{ margin:0 auto; width:auto; max-width:314px; height:auto; }
.our-team .our-team-box{ float:left; width:auto; max-width:300px; padding:30px 10px 60px 10px; }
.our-team .our-team-box h1{ float:left; width:100%; max-width:300px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.our-team .our-team-box h2{ float:left; width:100%; max-width:300px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:20px;}
.our-team .our-team-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:10px;}
.our-team .our-team-box ol{ margin:0 auto; width:100%; max-width:223px; height:auto; }
.our-team .our-team-box ol li{ float:left; width:223px; height:223px; margin:20px 0; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; position:relative;}
.our-team .our-team-box ol li img{ position:absolute; width:223px; height:223px; z-index:99; -webkit-transition: opacity 0.2s ease-out; opacity:0; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px;}
.our-team .our-team-box ol li:hover img{ -webkit-transition: opacity 0.2s ease-out; opacity: 1; }
.our-team .our-team-box .content{ float:left; width:100%; height:auto; padding-top:65px; }
.our-team .our-team-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.our-team .our-team-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:14px; text-align:center; margin:0; padding:0; margin-bottom:3px;}
.our-team .our-team-box .content p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#FFFFFF; line-height:14px; text-align:center; }
.our-team .our-team-box .none .content{ float:left; width:100%; height:auto; padding-top:95px; }
.our-team .our-team-box .none{ border:5px #FFFFFF solid; width:213px; height:213px; }
.our-team .our-team-box .none h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.our-team .our-team-box .none h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:14px; text-align:center; margin:0; padding:0; margin-bottom:3px;}
.our-team .our-team-box .none a{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#FFFFFF; line-height:14px; text-align:center; }
.our-team .our-team-box .none a:hover{ color:#5D4337; }
}

/*********************Career*********************/
#wrapper-career{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#f5b69e; overflow:hidden;}
.footer-career { float:left; position:relative; width:100%; height:30px; background:#b2f0e3; margin-top:-30px; z-index:99; }
.footer-career #toTop { background:url(../images/career_totop.png) no-repeat; }
.footer-career #toTopHover { background:url(../images/career_totop.png) no-repeat; }

.career{ margin:0 auto; width:auto; max-width:980px; height:auto; }
.career .career-box{ float:left; width:auto; max-width:940px; padding:50px 20px 70px 20px; }
.career .career-box h1{ float:left; width:100%; max-width:940px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.career .career-box h2{ float:left; width:100%; max-width:940px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.career .career-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:30px;}
.career .career-box ol{ margin:0 auto; width:100%; max-width:788px; height:auto; }
.career .career-box ol li{ float:left; width:157px; height:157px; margin:20px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; position:relative; cursor:pointer;}
.career .career-box ol li a{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:4;}

.career .career-box .content{ float:left; width:100%; height:auto; padding-top:50px; }
.career .career-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; text-align:center; margin:0; padding:0;}
.career .career-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}
.career .career-box .box1{ background:#acdfe4; }
.career .career-box .box2{ background:#cea161; }
.career .career-box .box3{ background:#a5bbdb; }
.career .career-box .box4{ background:#e0d1a6; }

.career-description{ position:absolute; width:100%; height:100%; background-color:#ffc7b1; z-index:98; bottom:-100%;}
.career-description .description{ margin:0 auto; width:100%; max-width:980px; height:auto; margin-top:180px;}
.career-description .description .box-icon{ float:left; width:auto; height:auto; margin:0 20px; }
.career-description .description .box-icon .icon{ margin:0 auto; width:157px; height:157px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; margin-bottom:0;}
.career-description .description .box-icon .icon .content{ float:left; width:100%; height:auto; padding-top:50px;}
.career-description .description .box-icon .icon .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; text-align:center; margin:0; padding:0;}
.career-description .description .box-icon .icon .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}
.career-description .description .box-content{ float:right; width:100%; max-width:640px; height:auto; position:relative; padding-left:10px;}
.career-description .description .box-content p{ float:left; width:100%; max-width:640px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.career-description .description .box-content span{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-bottom:5px;}
.career-description .description .box-content span a{ color:#FFFFFF; }
.career-description .description .box-content .close{ position:absolute; width:29px; height:29px; top:-29px; right:20px; font-size:29px; }
.career-description .description .box-content .close a{ color:#5D4338; }


@media screen and (max-width: 960px) and (orientation : portrait) {
.career{ margin:0 auto; width:auto; max-width:715px; height:auto; }
.career .career-box{ float:left; width:auto; max-width:675px; padding:50px 20px 70px 20px;}
.career .career-box h1{ float:left; width:100%; max-width:675px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.career .career-box h2{ float:left; width:100%; max-width:675px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.career .career-box ol{ margin:0 auto; width:100%; max-width:550px; height:auto; }
.career .career-box ol li{ float:left; width:235px; height:235px; margin:20px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; position:relative;}
.career .career-box .content{ float:left; width:100%; height:auto; padding-top:50px; }
.career .career-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.career .career-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}

.career-description{ position:absolute; width:100%; height:100%; background-color:#ffc7b1; z-index:98; bottom:-100%;}
.career-description .description{ margin:0 auto; width:100%; height:auto; margin-top:250px;}
.career-description .description .box-icon{ float:left; width:100%; height:auto; margin:0;  margin-bottom:50px; }
.career-description .description .box-icon .icon{ margin:0 auto; width:204px; height:204px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px;}
.career-description .description .box-icon .icon .content{ float:left; width:100%; height:auto; padding-top:40px; }
.career-description .description .box-icon .icon .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.career-description .description .box-icon .icon .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}
.career-description .description .box-content{ float:none; margin:0 auto; width:100%; max-width:640px; height:auto; position:relative;}
.career-description .description .box-content p{ float:left; width:auto; max-width:640px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; padding:0 10px;}
.career-description .description .box-content span{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-bottom:5px; margin-left:10px;}
.career-description .description .box-content .close{ position:absolute; width:29px; height:29px; top:-29px; right:29px; }
}

@media screen and (max-width: 840px) {
	.career .career-box ol{ margin:0 auto; width:100%; max-width:550px; height:auto; }
}

@media screen and (max-width: 826px) and (orientation : portrait) {
.career .career-box ol{ margin:0 auto; width:100%; max-width:591px; height:auto;}
.career-description{ position:absolute; width:100%; height:100%; background-color:#ffc7b1; z-index:98; bottom:-100%;}
.career-description .description{ margin:0 auto; width:100%; height:auto; margin-top:250px;}
.career-description .description .box-icon{ float:left; width:100%; height:auto; margin:0;  margin-bottom:50px; }
.career-description .description .box-icon .icon{ margin:0 auto; width:204px; height:204px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px;}
.career-description .description .box-icon .icon .content{ float:left; width:100%; height:auto; padding-top:40px; }
.career-description .description .box-icon .icon .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.career-description .description .box-icon .icon .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}
.career-description .description .box-content{ float:none; margin:0 auto; width:100%; max-width:640px; height:auto; position:relative;}
.career-description .description .box-content p{ float:left; width:auto; max-width:640px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; padding:0 10px;}
.career-description .description .box-content span{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-bottom:5px; margin-left:10px;}
.career-description .description .box-content .close{ position:absolute; width:29px; height:29px; top:-29px; right:29px; }
}

@media only screen and (max-device-width: 640px) and (orientation : landscape) {
.career{ margin:0 auto; width:auto; max-width:640px; height:auto; }
.career .career-box{ float:left; width:auto; max-width:620px; padding:50px 20px 70px 20px; }
.career .career-box h1{ float:left; width:100%; max-width:620px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.career .career-box h2{ float:left; width:100%; max-width:620px; height:65px; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.career .career-box .item{ float:left; width:100%; max-width:620px; height:auto; margin-top:0;}
.career .career-box ol{ margin:0 auto; width:100%; max-width:595px; height:auto; float:left;}
.career .career-box ol li{ float:left; width:157px; height:157px; margin:20px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; position:relative;}
.career .career-box .content{ float:left; width:100%; height:auto; padding-top:50px; }
.career .career-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; text-align:center; margin:0; padding:0;}
.career .career-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}

.career-description{ position:absolute; width:100%; height:100%; background-color:#ffc7b1; z-index:98; bottom:-100%;}
.career-description .description{ margin:0 auto; width:100%; height:auto; margin-top:140px;}
.career-description .description .box-icon{ float:left; width:100%; height:auto; margin:0;  margin-bottom:50px; }
.career-description .description .box-icon .icon{ margin:0 auto; width:204px; height:204px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px;}
.career-description .description .box-icon .icon .content{ float:left; width:100%; height:auto; padding-top:70px; }
.career-description .description .box-icon .icon .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:58px; color:#5D4337; line-height:58px; text-align:center; margin:0; padding:0;}
.career-description .description .box-icon .icon .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}
.career-description .description .box-content{ float:none; margin:0 auto; width:100%; max-width:640px; height:auto; position:relative;}
.career-description .description .box-content p{ float:left; width:auto; max-width:640px; height:300px; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; padding:0 10px;}
.career-description .description .box-content span{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-bottom:5px; margin-left:10px;}
.career-description .description .box-content .close{ position:absolute; width:29px; height:29px; top:-29px; right:29px; }
}

@media screen and (max-width: 590px) and (orientation : portrait)  {
.career .career-box ol{ margin:0 auto; width:100%; max-width:274px; height:auto;}
}

@media screen and (max-width: 400px) and (orientation : portrait) {
.career{ margin:0 auto; width:auto; max-width:314px; height:auto; }
.career .career-box{ float:left; width:auto; max-width:294px; padding:30px 10px 60px 10px; }
.career .career-box h1{ float:left; width:100%; max-width:294px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.career .career-box h2{ float:left; width:100%; max-width:294px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.career .career-box ol{ margin:0 auto; width:100%; max-width:294px; height:auto; }
.career .career-box ol li{ float:left; width:294px; height:98px; margin:5px 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; position:relative;}
.career .career-box .content{ float:left; width:100%; height:auto; padding-top:22px; }
.career .career-box .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; text-align:center; margin:0; padding:0;}
.career .career-box .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}

.career-description{ position:absolute; width:100%; height:100%; background-color:#ffc7b1; z-index:98; bottom:-100%;}
.career-description .description{ margin:0 auto; width:100%; height:auto; margin-top:120px;}
.career-description .description .box-icon{ float:left; width:100%; height:auto; margin:0;  margin-bottom:10px; }
.career-description .description .box-icon .icon{ margin:0 auto; width:188px; height:188px; -moz-border-radius: 200px; -webkit-border-radius: 200px; border-radius: 200px; }
.career-description .description .box-icon .icon .content{ float:left; width:100%; height:auto; padding-top:65px;}
.career-description .description .box-icon .icon .content h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:54px; color:#5D4337; line-height:54px; text-align:center; margin:0; padding:0;}
.career-description .description .box-icon .icon .content h2{ float:left; width:100%; height:auto; font-family:klavika regularitalic; font-size:14px; color:#5D4337; line-height:20px; text-align:center; margin:0; padding:0;}
.career-description .description .box-content{ float:none; margin:0 auto; width:100%; max-width:294px; height:auto; position:relative;}
.career-description .description .box-content p{ float:left; width:auto; max-width:294px; height:auto; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:18px; padding:0;}
.career-description .description .box-content span{float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-bottom:5px; margin-left:0;}
.career-description .description .box-content .close{ position:absolute; width:29px; height:29px; top:-9px; right:29px; }
}

/*********************Contact*********************/

#wrapper-contact{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#b2f0e3; overflow:hidden;}
.footer-contact { float:left; position:relative; width:100%; height:30px; background:#d1d3d4; margin-top:-30px; z-index:99; }
.footer-contact #toTop { background:url(../images/contact_totop.png) no-repeat; }
.footer-contact #toTopHover { background:url(../images/contact_totop.png) no-repeat; }

.contact{ margin:0 auto; width:auto; max-width:980px; height:auto; }
.contact .contact-box{ float:left; width:100%; max-width:980px;  padding:50px 0 70px 20px; }
.contact .contact-box h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.contact .contact-box h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.contact .contact-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:40px;}
.contact-form{ margin:0 auto; width:100%; max-width:721px; height:auto;}
.contact-form .info{ float:left; width:306px; height:auto;}
.contact-form .info .info-box{ float:left; width:100%; max-width:306px; height:auto; margin-bottom:15px; }
.contact-form .info .info-box .icon{ float:left; width:80px; height:80px; font-size:80px; color:#FFFFFF; }
.contact-form .info .info-box .description{ float:right; width:216px; height:50px;}
.contact-form .info .info-box .description h1{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px;}
.contact-form .info .info-box .description p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}
.contact-form .info .info-box .description p a{ color:#5D4337; }

.contact-form .form{ float:right; width:294px; height:auto; margin-right:40px; }
.contact-form .form .form-box{ float:left; width:294px; height:auto; margin-bottom:3px;}
.contact-form .form .form-box p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px; }
.contact-form .form .form-box input{ float:left; width:100%; height:24px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form .form-box textarea{ float:left; width:99%; height:84px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form  .submit{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-top:5px; margin-bottom:5px;}
.contact-form .form  .submit a{ color:#FFFFFF;}


@media screen and (max-width: 960px) and (orientation : portrait) {
.contact{ margin:0 auto; width:auto; max-width:715px; height:auto; }
.contact .contact-box{ float:left; width:auto; max-width:675px; padding:50px 20px 70px 20px;}
.contact .contact-box h1{ float:left; width:100%; max-width:675px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.contact .contact-box h2{ float:left; width:100%; max-width:675px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:40px;}
.contact .contact-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:0;}
.contact-form{ margin:0 auto; width:100%; max-width:663px; height:auto; margin-top:0; }
.contact-form .info{ float:left; width:306px; height:auto; }
.contact-form .info .info-box{ float:left; width:306px; height:auto; margin-bottom:15px; }
.contact-form .info .info-box .icon{ float:left; width:80px; height:80px; }
.contact-form .info .info-box .description{ float:right; width:216px; height:50px;}
.contact-form .info .info-box .description h1{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px;}
.contact-form .info .info-box .description p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}

.contact-form .form{ float:right; width:294px; height:auto; margin-right:0;}
.contact-form .form .form-box{ float:left; width:294px; height:auto; margin-bottom:3px;}
.contact-form .form .form-box p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px; }
.contact-form .form .form-box input{ float:left; width:100%; height:24px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form .form-box textarea{ float:left; width:99%; height:84px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form .submit{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-top:5px; margin-bottom:5px;}
.contact-form .form .submit a{ color:#FFFFFF;}
}

@media only screen and (max-device-width: 640px) and (orientation : landscape) {
.contact{ margin:0 auto; width:auto; max-width:640px; height:auto; }
.contact .contact-box{ float:left; width:auto; max-width:580px; padding:50px 20px 70px 20px; }
.contact .contact-box h1{ float:left; width:100%; max-width:580px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.contact .contact-box h2{ float:left; width:100%; max-width:580px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:40px;}
.contact .contact-box .item{ float:left; width:100%; max-width:580px; height:auto; margin-top:0;}
.contact-form{ margin:0 auto; width:100%; max-width:580px; height:auto; margin-top:0; float:left;}
.contact-form .info{ float:left; width:306px; height:auto; }
.contact-form .info .info-box{ float:left; width:306px; height:auto; margin-bottom:15px; }
.contact-form .info .info-box .icon{ float:left; width:80px; height:80px; }
.contact-form .info .info-box .description{ float:right; width:216px; height:50px;}
.contact-form .info .info-box .description h1{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px;}
.contact-form .info .info-box .description p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}

.contact-form .form{ float:right; width:220px; height:auto; margin-right:0;}
.contact-form .form .form-box{ float:left; width:210px; height:auto; margin-bottom:3px;}
.contact-form .form .form-box p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px; }
.contact-form .form .form-box input{ float:left; width:100%; height:24px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form .form-box textarea{ float:left; width:103%; height:84px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form .submit{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-top:5px; margin-bottom:5px;}
.contact-form .form .submit a{ color:#FFFFFF;}
}

@media screen and (max-width: 635px) and (orientation : portrait) {
	.contact-form{ margin:0 auto; width:100%; max-width:306px; height:auto; margin-top:0;}
	.contact-form .form{ float:left; width:294px; height:auto; margin-right:0; margin-top:20px;}
}

@media screen and (max-width: 400px) and (orientation : portrait) {
.contact{ margin:0 auto; width:auto; max-width:314px; height:auto; }
.contact .contact-box{ float:left; width:auto; max-width:294px; padding:30px 10px 60px 10px; }
.contact .contact-box h1{ float:left; width:100%; max-width:294px; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.contact .contact-box h2{ float:left; width:100%; max-width:294px; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:0;}
.contact .contact-box .item{ float:left; width:100%; max-width:940px; height:auto; margin-top:30px;}
.contact-form{ margin:0 auto; width:100%; max-width:294px; height:auto; margin-top:0;}
.contact-form .info{ float:left; width:100%; max-width:294px; height:auto;}
.contact-form .info .info-box{ float:left; width:294px; height:auto; margin-bottom:15px; }
.contact-form .info .info-box .icon{ float:left; width:80px; height:80px; }
.contact-form .info .info-box .description{ float:right; width:200px; height:50px;}
.contact-form .info .info-box .description h1{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px;}
.contact-form .info .info-box .description p{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px;}

.contact-form .form{ float:left; width:294px; height:auto; margin-right:0; margin-top:20px;}
.contact-form .form .form-box{ float:left; width:294px; height:auto; margin-bottom:3px;}
.contact-form .form .form-box p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px; }
.contact-form .form .form-box input{ float:left; width:284px; height:24px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form .form-box textarea{ float:left; width:292px; height:84px; border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-indent:10px; font-size:12px; color:#5D4337; }
.contact-form .form  .submit{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-top:5px; margin-bottom:5px;}
.contact-form .form  .submit a{ color:#FFFFFF;}
}

/*********************Story*********************/
#wrapper-story{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#edb7b7; overflow:hidden;}
.footer-story { float:left; position:relative; width:100%; height:30px; background:#d3d3d3; margin-top:-30px; z-index:99; }
.footer-story #toTop { background:url(../images/story_totop.png) no-repeat; }
.footer-story #toTopHover { background:url(../images/story_totop.png) no-repeat; }

.story{ margin:0 auto; width:auto; max-width:980px; height:auto; }
.story .story-box{ float:left; width:100%; max-width:980px; padding:50px 0 70px 20px; }
.story .story-box .story-description{ float:left; width:350px; height:auto; }
.story .story-box .story-description h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
.story .story-box .story-description h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:10px;}
.story .story-box .story-description .chef{ float:left; width:350px; height:auto; }
.story .story-box .story-description .chef h3{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:12px; color:#5D4337; line-height:20px; border-bottom:11px solid #5D4337; }
.story .story-box .story-description .chef ol{ float:left; width:100%; height:auto; }
.story .story-box .story-description .chef ol li{ float:left; width:100%; height:18px; border-bottom:1px solid #5D4337;  }
.story .story-box .story-description .chef p{ float:left; width:auto; height:auto; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:18px; }
.story .story-box .story-description .chef .line{ text-indent:20px; }
.story .story-box .story-description .chef .medium{  font-family:klavika medium; }
.story .story-box .story-description .chef .right{ float:right; }
.story .story-box .story-description .chef .remark{ font-size:11px; margin:10px 0; }
.story .story-box .story-description .btn{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
.story .story-box .story-description .btn a{ color:#FFFFFF;}

.story .story-box .story-icon{ float:right; width:380px; height:auto; margin-right:100px; margin-top:30px;}
.story .story-box .story-icon .category{ float:left; width:100%; height:auto; }
.story .story-box .story-icon .category ol{ float:left; width:100%; height:auto; position:relative;}
.story .story-box .story-icon .category ol li{ float:left; width:auto; height:auto; padding:2px 29px; font-family:colognesixty; font-size:17px; color:#FD8383; line-height:29px; background:#5D4337; margin:0 1px; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; position:relative; z-index:99;
	/*-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; */
}
.story .story-box .story-icon .category .shadow{ position:absolute; bottom:0; left:-23px; background: url(../images/shadow.png) center no-repeat; width:395px; height:17px; }
.story .story-box .story-icon .category a{ color:#FD8383; }
.story .story-box .story-icon .category .active,.story .story-box .story-icon .category li:hover{ background-color:#FFFFFF; }
.story .story-box .story-icon .icon{ float:left; width:100%; height:auto; margin-top:40px;}
.story .story-box .story-icon .icon ol{ float:left; width:100%; height:auto; }
.story .story-box .story-icon .icon ol li{ float:left; width:52px; height:52px; border:4px solid #FFF; -moz-border-radius: 60px; -webkit-border-radius: 60px; border-radius: 60px; margin:0 8px 55px 8px; position:relative; }
.story .story-box .story-icon .icon ol li span{ position:absolute; width:100%; height:100%; font-size:52px; overflow:hidden; color:#FFFFFF; display:none;}
.story .story-box .story-icon .icon p{ position:absolute; top:62px; width:52px; height:auto; font-family:klavika regular; font-size:10px; color:#FFF; line-height:12px; text-align:center; }

@media screen and (max-width: 850px) {
	.story{ margin:0 auto; width:auto; max-width:390px; height:auto;}
	.story .story-box .story-icon{ float:left; width:390px; height:auto; margin-right:0; margin-top:50px; }
	.story .story-box .story-icon .icon{ float:none; margin:0 auto; width:405px; height:auto; margin-top:60px;}
	.story .story-box .story-icon .icon ol{ float:left; width:390px; height:auto; }
}

@media screen and (max-width: 960px) and (orientation : portrait) {
.story{ margin:0 auto; width:auto; max-width:715px; height:auto; }
.story .story-box{ float:left; width:auto; max-width:675px; padding:50px 20px 70px 20px; }
.story .story-box .story-description{ float:left; width:100%; height:auto; }
.story .story-box .story-description h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
.story .story-box .story-description h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:10px;}

.story .story-box .story-description .chef{ float:left; width:350px; height:auto; display:none; margin-left:10px; }
.story .story-box .story-description .btn{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
.story .story-box .story-description .btn a{ color:#FFFFFF;}

.story .story-box .story-icon{ float:left; width:100%; height:auto; margin-top:10px; margin-right:0;}
.story .story-box .story-icon .category{ float:left; width:100%; height:auto; }
.story .story-box .story-icon .category ol{ float:left; width:100%; height:auto; position:relative;}
.story .story-box .story-icon .category ol li{ float:left; width:auto; height:auto; padding:2px 29px; font-family:colognesixty; font-size:17px; color:#FD8383; line-height:29px; background:#5D4337; margin:0 1px; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; position:relative; z-index:99;}
.story .story-box .story-icon .category .shadow{ position:absolute; bottom:0; left:-23px; background: url(../images/shadow.png) center no-repeat; width:395px; height:17px; }
.story .story-box .story-icon .category a{ color:#FD8383; }
.story .story-box .story-icon .category .active{ background-color:#FFFFFF; }
.story .story-box .story-icon .icon{ float:none; margin:0 auto; width:100%; height:auto; margin-top:60px;}
.story .story-box .story-icon .icon ol{ float:left; width:100%; height:auto; }
.story .story-box .story-icon .icon ol li{ float:left; width:85px; height:84px; border:5px solid #FFF; -moz-border-radius: 60px; -webkit-border-radius: 60px; border-radius: 60px; margin:0 20px 50px 20px; }
.story .story-box .story-icon .icon ol li span{ position:absolute; width:100%; height:100%; font-size:84px; overflow:hidden; color:#FFFFFF; display:none;}
.story .story-box .story-icon .icon p{ position:absolute; top:95px;  width:85px; height:auto; font-family:klavika regular; font-size:14px; color:#FFF; line-height:16px; text-align:center; }
}

@media screen and (max-width: 750px) {
	.story .story-box .story-icon .category{ float:left; margin:0 auto; width:350px; height:auto; }
	.story .story-box .story-icon .icon{ float:none; margin:0 auto; width:540px; height:auto; margin-top:60px;}
}

@media screen and (max-width: 580px) {
	.story .story-box .story-icon .category{ float:left; margin:0 auto; width:350px; height:auto; }
	.story .story-box .story-icon .icon{ float:none; margin:0 auto; width:405px; height:auto; margin-top:60px;}
}
@media screen and (max-width: 400px) and (orientation : portrait) {
.story{ margin:0 auto; width:auto; max-width:314px; height:auto; }
.story .story-box{ float:left; width:auto; max-width:294px; padding:30px 10px 60px 10px; }
.story .story-box .story-description{ float:left; width:100%; height:auto; }
.story .story-box .story-description h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
.story .story-box .story-description h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:20px; margin-bottom:10px;}

.story .story-box .story-description .chef{ float:left; width:350px; height:auto; display:none; }
.story .story-box .story-description .btn{ float:left; background:#5D4337; font-family:colognesixty; font-size:18px; color:#FFFFFF; padding:2px 10px; margin-top:10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
.story .story-box .story-description .btn a{ color:#FFFFFF;}

.story .story-box .story-icon{ float:left; width:100%; height:auto; margin-top:10px; margin-right:0;}
.story .story-box .story-icon .category{ float:left; width:100%; height:auto;  }
.story .story-box .story-icon .category ol{ float:left; width:100%; height:auto; position:relative;}
.story .story-box .story-icon .category ol li{ float:left; width:auto; height:auto; padding:2px 14px; font-family:colognesixty; font-size:17px; color:#FD8383; line-height:29px; background:#5D4337; margin:0 1px; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; position:relative; z-index:99;}
.story .story-box .story-icon .category .shadow{ position:absolute; bottom:0; left:-15px;  background: url(../images/shadow_iphone.png) center no-repeat; width:289px; height:13px; }
.story .story-box .story-icon .category a{ color:#FD8383; }
.story .story-box .story-icon .category .active{ background-color:#FFFFFF; }
.story .story-box .story-icon .icon{ float:none; margin:0 auto; width:294px; height:auto; margin-top:60px;}
.story .story-box .story-icon .icon ol{ float:left; width:100%; height:auto; }
.story .story-box .story-icon .icon ol li{ float:left; width:70px; height:70px; border:4px solid #FFF; -moz-border-radius: 60px; -webkit-border-radius: 60px; border-radius: 60px; margin:0 10px 45px 10px; }
.story .story-box .story-icon .icon ol li span{ position:absolute; width:100%; height:100%; font-size:70px; overflow:hidden; color:#FFFFFF; display:none;}
.story .story-box .story-icon .icon p{ position:absolute; top:80px; width:70px; height:auto; font-family:klavika regular; font-size:12px; color:#FFF; line-height:16px; text-align:center; }
}


/*********************Works*********************/
.fixed{ position:fixed;}

#wrapper-works{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#d3d3d3; overflow:hidden;}
.footer-works { float:left; position:relative; width:100%; height:30px; background:#f7dc95; margin-top:-30px; z-index:99; }
.footer-works #toTop { background:url(../images/works_totop.png) no-repeat; }
.footer-works #toTopHover { background:url(../images/works_totop.png) no-repeat; }

.works{ margin:0 auto; width:auto; max-width:980px; height:auto; margin-top:100px; }
.works .works-box{ float:left; width:auto; max-width:940px; padding:50px 20px 70px 20px; position:relative;}
.works .works-box .text{ float:left; width:300px; height:auto;}
.works .works-box .text h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;  }
.works .works-box .text h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:10px; }
.works .works-box .icon{ float:right; width:auto; height:69px; }
.works .works-box .icon span{ float:left; width:67px; height:67px; margin:0 3px; font-size:67px; color:#5D4338; cursor:pointer; }
.works .works-box .icon span:hover,.works .works-box .icon .active{ color:#fff; }

.works .works-box .works-list{ float:left; width:100%; height:auto; margin-top:40px; }
.works .works-box .works-list ol{ float:left; width:100%; height:auto;}
.works .works-box .works-list .item{ float:left; width:100%; height:100%; overflow:hidden; position:relative; }
.works .works-box .works-list ol li{ float:left; width:24%; height:auto; margin:7px 0.5%; }
.works .works-box .works-list ol li a{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:4;}
.works .works-box .works-list .thumbnail{ float:left; width:100%; height:auto; position:relative;}
.works .works-box .works-list .thumbnail img{ width:100%; height:auto; }
.works .works-box .works-list .vector{ position:absolute; top:0; left:0; z-index:98; }
.works .works-box .works-list .vector img{ width:auto; height:auto; }
.works .works-box .works-list .description{ float:left; width:100%; height:auto; margin-top:5px; }
.works .works-box .works-list .description h1{ float:left; width:100%; height:16px; font-family:klavika medium; font-size:13px; color:#5D4337; line-height:16px; overflow:hidden;  }
.works .works-box .works-list .description h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:12px; color:#9e887e; line-height:16px;  }

.works .works-box .works-list .rollover{ position:absolute; z-index:98px; width:84%; height:100%; background:#EDA4A4; padding:15% 8% 0 8%; top:100%; }
.works .works-box .works-list .rollover h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:38px; color:#5D4337; line-height:38px; }
.works .works-box .works-list .rollover p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:13px; color:#FFFFFF; line-height:16px; margin-top:10px;  }
.works .works-box .works-list .rollover span{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:13px; color:#FFFFFF; line-height:16px;  }

#showcase{ float:left; width:100%; height:auto;}
#showcase h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
#showcase h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; }
#showcase h1 p{ float:left; }
#showcase h2 span{ float:left; width:auto; padding-right:10px; margin:10px 10px 10px 0; border-right:1px #5D4337 solid; height:14px; line-height:14px; }
#showcase h2 span:last-child{ border:none;  }
#showcase h2 a{ color:#5D4337; }
#showcase h2 a:hover{ color:#beb4af; }
#showcase .icon{ float:left; width:auto; height:auto; margin-top:8px; margin-left:20px;}
#showcase .icon span{ float:left; width:27px; height:27px; margin:3px 2px; font-size:27px;}
#showcase .icon span:hover{ color:#5D4337; cursor:auto; }
#showcase .images{ margin:0 auto; width:100%; max-width:940px; height:auto; margin-top:20px; text-align:center; }
#showcase .images img{ float:none; width:auto; max-width:940px; height:auto; margin:5px 0; }
#work-detail{ width:100%; height:auto; padding-bottom:30px; float:left; display:none;}
#work-list{ width:100%; height:auto; float:left; display:block;}
#work-close{ position:absolute; width:29px; height:29px; top:55px; right:20px; opacity:0; z-index:98;}
#work-close span{ float:left; width:29px; height:29px; font-size:29px; color:#5D4338; }

.morebox{ float:left; width:100%; height:48px; position:relative; margin-top:15px; }
.more{ position:absolute; left:50%; margin-left:-24px; width:48px; height:48px; background:#5D4337; -moz-border-radius: 48px; -webkit-border-radius: 48px; border-radius: 48px; }
.more p{ float:left; width:48px; font-family:colognesixty; font-size:20px; line-height:48px; text-align:center; color:#FFFFFF; }
.more img{ float:left; margin:4px}

@media only screen and (max-device-width: 640px) and (orientation : landscape) {
#showcase .images img{ float:none; width:100%; max-width:940px; height:auto; margin:5px 0; }
}

@media screen and (max-width: 920px){
	.works .works-box .works-list ol li{ float:left; width:32%; height:auto; margin:7px 0.66%; position:relative; overflow:hidden;}
}

@media screen and (max-width: 960px) and (orientation : portrait) {
.fixed{ position:fixed;}

.works{ margin:0 auto; width:auto; max-width:740px; height:auto; /* margin-top:190px; */}
.works .works-box{ float:left; width:auto; padding:50px 20px 70px 20px; position:relative;}
.works .works-box .text{ float:left; width:350px; height:auto; }
.works .works-box .text h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.works .works-box .text h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:10px;}
.works .works-box .icon{ float:right; width:auto; height:69px; }

.works .works-box .works-list{ float:left; width:100%; height:auto; margin-top:20px; }
.works .works-box .works-list ol{ float:left; width:100%; height:auto;}
.works .works-box .works-list ol li{ float:left; width:46%; height:auto; margin:7px 2%; cursor:pointer;}
.works .works-box .works-list .thumbnail{ float:left; width:100%; height:auto; position:relative;  }
.works .works-box .works-list .thumbnail img{ width:100%; height:auto; }
.works .works-box .works-list .vector{ position:absolute; top:0; left:0; z-index:98; }
.works .works-box .works-list .vector img{ width:auto; height:auto; }
.works .works-box .works-list .description{ float:left; width:100%; height:auto; margin-top:5px; }
.works .works-box .works-list .description h1{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:16px;  }
.works .works-box .works-list .description h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:13px; color:#9e887e; line-height:16px;  }

.works .works-box .works-list .rollover{ position:absolute; z-index:98px; width:100%; height:100%; background:#EDA4A4; padding:15% 8% 0 8%; }
.works .works-box .works-list .rollover h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:38px; color:#5D4337; line-height:38px; }
.works .works-box .works-list .rollover p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:16px; color:#FFFFFF; line-height:20px;  }
.works .works-box .works-list .rollover span{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:16px; color:#FFFFFF; line-height:20px;  }

#showcase{ float:left; width:100%; height:auto;}
#showcase h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
#showcase h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin:10px 0;}
#showcase h1 p{ float:left; margin-right:20px; }
#showcase h2 span{ float:left; width:auto; padding-right:10px; margin-right:10px; border-right:1px #5D4337 solid; height:14px; line-height:14px; margin-bottom:10px;  }
#showcase h2 span:last-child{ border:none;  }
#showcase .icon{ float:left; width:auto; height:auto; margin-top:8px; margin-left:-2px;}
#showcase .icon span{ float:left; width:27px; height:27px; margin:3px 2px; font-size:27px;}
#showcase .icon span:hover{ color:#5D4337; cursor:auto; }
#showcase .images{ float:left; width:100%; height:auto; margin-top:0; }
#showcase .images img{ float:left; width:100%; height:auto; margin:5px 0; }
#work-detail{ width:100%; height:auto; padding-bottom:30px; float:left; display:none;}
#work-list{ width:100%; height:auto; float:left; display:block;}
#work-close{ position:absolute; width:29px; height:29px; top:60px; right:20px; opacity:0; z-index:98;}

}

@media screen and (max-device-width: 640px) and (orientation : landscape) {
.works{ margin:0 auto; width:auto; max-width:980px; height:auto; margin-top:70px; }
.works .works-box{ float:left; width:auto; max-width:940px; padding:50px 20px 70px 20px; position:relative;}
.works .works-box .text{ float:left; width:300px; height:auto;}
.works .works-box .text h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;  }
.works .works-box .text h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:10px; }
.works .works-box .icon{ float:right; width:auto; height:69px; }
.works .works-box .icon span{ float:left; width:67px; height:67px; margin:0 3px; font-size:67px; color:#5D4338; cursor:pointer; }
.works .works-box .icon span:hover,.works .works-box .icon .active{ color:#fff; }

.works .works-box .works-list{ float:left; width:100%; height:auto; margin-top:40px; }
.works .works-box .works-list ol{ float:left; width:100%; height:auto;}
.works .works-box .works-list ol li{ float:left; width:24%; height:auto; margin:7px 0.5%;}
.works .works-box .works-list ol li a{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:4;}

.works .works-box .works-list .rollover{ position:absolute; z-index:98px; width:100%; height:100%; background:#EDA4A4; padding:15% 8% 0 8%; top:100%; }
.works .works-box .works-list .rollover h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:20px; color:#5D4337; line-height:20px; }
.works .works-box .works-list .rollover p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:10px; color:#FFFFFF; line-height:14px;  }
.works .works-box .works-list .rollover span{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:10px; color:#FFFFFF; line-height:14px;  }
}

@media screen and (max-width: 600px) and (orientation : portrait){
	.works .works-box .icon{ float:left; width:auto; height:69px; }
	.works .works-box .works-list ol{ float:none; margin:0 auto; width:294px; height:auto;}
	.works .works-box .works-list ol li{ float:left; width:294px; height:225px; margin:7px 0; cursor:pointer;}
}

@media screen and (max-width: 400px) and (orientation : portrait) {
.fixed{ position:relative;}

.works{ margin:0 auto; width:auto; max-width:314px; height:auto; margin-top:60px;}
.works .works-box{ float:left; width:auto; max-width:294px; padding:30px 10px 60px 10px;  position:relative;}
.works .works-box .text{ float:left; width:100%; height:auto; }
.works .works-box .text h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
.works .works-box .text h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin-bottom:10px;}
.works .works-box .icon{ float:left; width:100%; height:69px; }

.works .works-box .works-list{ float:left; width:100%; height:auto; margin-top:20px; }
.works .works-box .works-list ol{ float:left; width:100%; height:auto;}
.works .works-box .works-list ol li{ float:left; width:294px; height:215px; margin:7px 0; cursor:pointer; }
.works .works-box .works-list .thumbnail{ float:left; width:294px; height:177px; position:relative;}
.works .works-box .works-list .thumbnail img{ width:294px; height:auto; }
.works .works-box .works-list .vector{ position:absolute; top:0; left:0; z-index:98; }
.works .works-box .works-list .vector img{ width:auto; height:auto; }
.works .works-box .works-list .description{ float:left; width:294px; height:auto; margin-top:5px; }
.works .works-box .works-list .description h1{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:12px; color:#5D4337; line-height:14px;  }
.works .works-box .works-list .description h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:11px; color:#9e887e; line-height:14px;  }

.works .works-box .works-list .rollover{ position:absolute; z-index:98px; width:264px; height:155px; background:#EDA4A4; padding:60px 15px 0 15px; }
.works .works-box .works-list .rollover h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:38px; color:#5D4337; line-height:38px; }
.works .works-box .works-list .rollover p{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:16px; color:#FFFFFF; line-height:20px;  }
.works .works-box .works-list .rollover span{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:16px; color:#FFFFFF; line-height:20px;  }

#showcase{ float:left; width:100%; height:auto;}
#showcase h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px; }
#showcase h2{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; margin:10px 0;}
#showcase h1 p{ float:left;  margin-right:0; }
#showcase h2 span{ float:left; width:100%; padding-right:0; margin-right:0; border-right:none; height:auto; line-height:12px; margin-bottom:0; }
#showcase .icon{ float:left; width:100%; height:auto; margin-top:18px; margin-left:-2px;}
#showcase .icon span{ float:left; width:27px; height:27px; margin:3px 2px; font-size:27px;}
#showcase .icon span:hover{ color:#5D4337; cursor:auto; }
#showcase .images{ float:left; width:100%; height:auto; margin-top:0; }
#showcase .images img{ float:left; width:100%; height:auto; margin:5px 0; }
#work-detail{ width:100%; height:auto; padding-bottom:10px; float:left; display:none;}
#work-list{ width:100%; height:auto; float:left; display:block;}
#work-close{ position:absolute; width:29px; height:29px; top:40px; right:10px; opacity:0; z-index:98;}
}

/*********************Process*********************/
#wrapper-process{ float:left; width:100%; height:auto; min-height:100%; position:relative; background-color:#f7dc95; overflow:hidden;}
.footer-process { float:left; position:relative; width:100%; height:30px; background:#c2e1ab; margin-top:-30px; z-index:99; }
.footer-process #toTop { background:url(../images/process_totop.png) no-repeat; }
.footer-process #toTopHover { background:url(../images/process_totop.png) no-repeat; }

.process{ margin:0 auto; width:auto; max-width:980px; height:auto; }
.process .process-box{ float:left; width:auto; max-width:940px; padding:50px 20px 70px 20px;}
.process .process-box h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.process .process-box h2{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px;}
.process .process-box h3{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; }
.process .process-box .info{ float:left; width:100%; height:12px; margin-top:20px; margin-bottom:40px;}
.process .process-box .info span img{ float:left; margin-right:3px; }
.process .process-box .info span{ float:left; width:auto; height:12px; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:12px; margin-right:10px;  }

.process-chart-scroll{ display:none; }

.process-chart{ float:left; width:100%; max-width:940px; height:277px; position:relative; display:block;}
.process-chart ol{ float:left; width:100%; max-width:940px; height:277px; position:relative;}
.process-chart #process-slide{ position:absolute; left:0; top:0; }
.process-chart ol li{ position:absolute; width:auto; height:auto; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:12px; }
.process-chart .process-1{ left:130px; top:150px; display:none;}
.process-chart .process-2{ left:144px; top:91px; display:none;}
.process-chart .process-3{ left:177px; top:70px; display:none;}
.process-chart .process-4{ left:179px; top:144px; display:none;}
.process-chart .process-5{ left:247px; top:79px; display:none;}
.process-chart .process-6{ left:246px; top:138px; display:none;}
.process-chart .process-7{ left:324px; top:146px; display:none;}
.process-chart .process-8{ left:374px; top:31px; display:none;}
.process-chart .process-9{ left:400px; top:153px; display:none;}
.process-chart .process-10{ left:446px; top:38px; display:none;}
.process-chart .process-11{ left:520px; top:99px; display:none;}
.process-chart .process-12{ left:473px; top:146px; display:none;}
.process-chart .process-13{ left:571px; top:45px; display:none;}
.process-chart .process-14{ left:577px; top:151px; display:none;}
.process-chart .process-15{ left:643px; top:4px; display:none;}
.process-chart .process-16{ left:745px; top:133px; display:none;}
.process-chart .process-17{ left:810px; top:22px; display:none;}
.process-chart .process-18{ left:848px; top:155px; display:none;}
.process-chart .process-19{ left:887px; top:0; display:none;}
.process-chart .process-20{ left:964px; top:0px; display:none;}
.process-chart .process-21{ left:1052px; top:32px; display:none;}
.process-chart .process-22{ left:1105px; top:65px; display:none;}
.process-chart .process-23{ left:1081px; top:152px; display:none;}
.process-chart .process-24{ left:1144px; top:99px; display:none;}
.process-chart .process-25{ left:1149px; top:158px; display:none;}
.process-chart .process-26{ left:1196px; top:114px; display:none;}
.process-chart .process-27{ left:1236px; top:46px; display:none;}
.process-chart .process-28{ left:1208px; top:152px; display:none;}
.process-chart .process-29{ left:1263px; top:159px; display:none;}
.process-chart .process-30{ left:1373px; top:45px; display:none;}

.process-chart  .btn-prve{ position:absolute; width:41px; height:41px; left:0; top:50%; z-index:99;  }
.process-chart .btn-next{ position:absolute; width:41px; height:41px; right:0; top:50%; z-index:99;  }
/*width:1351px*/
.process-chart .process-text{ float:left; width:781px; height:auto; margin-top:135px; margin-left:80px; }
.process-chart .process-text .dot{ border-bottom:#555 dotted 1px; }
.process-chart .process-text p{ font-family:milansixty; font-size:18px; color:#5D4337; line-height:24px;}


@media screen and (max-width: 960px) and (orientation : portrait) {
.process{ margin:0 auto; width:auto; max-width:100%; height:auto; }
.process .process-box{ float:left; width:auto; max-width:90%; padding:50px 5% 70px;}
.process .process-box h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.process .process-box h2{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:14px; color:#5D4337; line-height:20px;}
.process .process-box h3{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:14px; color:#5D4337; line-height:20px; }
.process .process-box .info{ float:left; width:100%; height:12px; margin-top:20px; margin-bottom:40px;}
.process .process-box .info span img{ float:left; margin-right:3px; }
.process .process-box .info span{ float:left; width:auto; height:12px; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:12px; margin-right:10px;  margin-bottom:20px;  }

.process-chart{ display:none; }

.process-chart-scroll{ margin:0 auto; width:100%; max-width:675px; height:auto; position:relative; display:block;}
.process-chart-scroll ol{ margin:0 auto; width:100%; max-width:675px; height:auto; position:relative;}
.process-chart-scroll #process-scroll{ position:relative; float:left; width:100%; max-width:675px;  }
.process-chart-scroll ol li{ position:absolute; width:auto; height:auto; font-family:klavika regular; font-size:16px; color:#5D4337; text-align:center; }

.process-chart-scroll .process-1-scroll{ left:317px; top:171px; display:none;}
.process-chart-scroll .process-1-scroll p{ position:absolute; line-height:33px; left:-36px; top:0;}
.process-chart-scroll .process-2-scroll{ left:328px; top:194px; display:none;}
.process-chart-scroll .process-2-scroll p{ position:absolute; line-height:65px; right:-60px; top:0;}
.process-chart-scroll .process-3-scroll{ left:315px; top:246px; display:none;}
.process-chart-scroll .process-3-scroll p{ position:absolute; line-height:91px; right:-95px; top:0;}
.process-chart-scroll .process-4-scroll{ left:267px; top:304px; display:none;}
.process-chart-scroll .process-4-scroll p{ position:absolute; line-height:91px; left:-141px; top:0;}
.process-chart-scroll .process-5-scroll{ left:325px; top:358px; display:none;}
.process-chart-scroll .process-5-scroll p{ position:absolute; line-height:72px; right:-72px; top:0;}
.process-chart-scroll .process-6-scroll{ left:257px; top:400px; display:none;}
.process-chart-scroll .process-6-scroll p{ position:absolute; line-height:110px; left:-220px; top:0;}
.process-chart-scroll .process-7-scroll{ left:273px; top:496px; display:none;}
.process-chart-scroll .process-7-scroll p{ position:absolute; line-height:81px; left:-151px; top:0;}
.process-chart-scroll .process-8-scroll{ left:308px; top:562px; display:none;}
.process-chart-scroll .process-8-scroll p{ position:absolute; line-height:105px; right:-135px; top:0;}
.process-chart-scroll .process-9-scroll{ left:278px; top:640px; display:none;}
.process-chart-scroll .process-9-scroll p{ position:absolute; line-height:65px; left:-120px; top:0;}
.process-chart-scroll .process-10-scroll{ left:298px; top:678px; display:none;}
.process-chart-scroll .process-10-scroll p{ position:absolute; line-height:124px; right:-194px; top:0;}
.process-chart-scroll .process-11-scroll{ left:319px; top:796px; display:none;}
.process-chart-scroll .process-11-scroll p{ position:absolute; line-height:28px; right:-93px; top:0;}
.process-chart-scroll .process-12-scroll{ left:273px; top:819px; display:none;}
.process-chart-scroll .process-12-scroll p{ position:absolute; line-height:81px; left:-261px; top:0; width:255px;}
.process-chart-scroll .process-13-scroll{ left:310px; top:877px; display:none;}
.process-chart-scroll .process-13-scroll p{ position:absolute; line-height:100px; right:-120px; top:0;}
.process-chart-scroll .process-14-scroll{ left:281px; top:953px; display:none;}
.process-chart-scroll .process-14-scroll p{ position:absolute; line-height:67px; left:-157px; top:0;}
.process-chart-scroll .process-15-scroll{ left:285px; top:992px; display:none;}
.process-chart-scroll .process-15-scroll p{ position:absolute; line-height:222px; right:-112px; top:0;}
.process-chart-scroll .process-16-scroll{ left:256px; top:1178px; display:none;}
.process-chart-scroll .process-16-scroll p{ position:absolute; line-height:119px; left:-129px; top:0;}
.process-chart-scroll .process-17-scroll{ left:317px; top:1259px; display:none;}
.process-chart-scroll .process-17-scroll p{ position:absolute; line-height:142px; right:-112px; top:0;}
.process-chart-scroll .process-18-scroll{ left:291px; top:1365px; display:none;}
.process-chart-scroll .process-18-scroll p{ position:absolute; line-height:49px; left:-59px; top:0;}
.process-chart-scroll .process-19-scroll{ left:334px; top:1382px; display:none;}
.process-chart-scroll .process-19-scroll p{ position:absolute; line-height:161px; right:-121px; top:0;}
.process-chart-scroll .process-20-scroll{ left:334px; top:1506px; display:none;}
.process-chart-scroll .process-20-scroll p{ position:absolute; line-height:161px; right:-121px; top:0;}
.process-chart-scroll .process-21-scroll{ left:324px; top:1647px; display:none;}
.process-chart-scroll .process-21-scroll p{ position:absolute; line-height:96px; right:-146px; top:0;}
.process-chart-scroll .process-22-scroll{ left:325px; top:1731px; display:none;}
.process-chart-scroll .process-22-scroll p{ position:absolute; line-height:65px; right:-115px; top:0;}
.process-chart-scroll .process-23-scroll{ left:300px; top:1764px; display:none;}
.process-chart-scroll .process-23-scroll p{ position:absolute; line-height:46px; left:-96px; top:0;}
.process-chart-scroll .process-24-scroll{ left:311px; top:1794px; display:none;}
.process-chart-scroll .process-24-scroll p{ position:absolute; line-height:71px; right:-61px; top:0;}
.process-chart-scroll .process-25-scroll{ left:304px; top:1850px; display:none;}
.process-chart-scroll .process-25-scroll p{ position:absolute; line-height:32px; left:-62px; top:0;}
.process-chart-scroll .process-26-scroll{ left:318px; top:1878px; display:none;}
.process-chart-scroll .process-26-scroll p{ position:absolute; line-height:32px; right:-62px; top:0;}
.process-chart-scroll .process-27-scroll{ left:334px; top:1942px; display:none;}
.process-chart-scroll .process-27-scroll p{ position:absolute; line-height:53px; right:-211px; top:0; width:205px;}
.process-chart-scroll .process-28-scroll{ left:324px; top:1997px; display:none;}
.process-chart-scroll .process-28-scroll p{ position:absolute; line-height:21px; left:-120px; top:0; }
.process-chart-scroll .process-29-scroll{ left:308px; top:2124px; display:none;}
.process-chart-scroll .process-29-scroll p{ position:absolute; line-height:32px; left:-230px; top:0; width:225px; }
.process-chart-scroll .process-30-scroll{ left:334px; top:2161px; display:none;}
.process-chart-scroll .process-30-scroll p{ position:absolute; line-height:32px; right:-230px; top:0; width:225px; }
/*height:2318px*/
.process-chart-scroll .process-text-scroll{ float:left; width:161px; height:2318px; margin-top:0; margin-left:257px;   }
.process-chart-scroll .process-text-scroll .dot{ border-right:#555 dotted 1px; }
.process-chart-scroll .process-text-scroll span{ margin-right:10px; }
.process-chart-scroll .process-text-scroll p{ float:left; width:80px; height:100%; font-family:milansixty; font-size:52px; color:#5D4337; line-height:52px; text-align:center; }

}

@media screen and (max-width: 480px) and (orientation : portrait) {
.process{ margin:0 auto; width:auto; max-width:100%; height:auto; }
.process .process-box{ float:left; width:auto; max-width:90%; padding:30px 5% 60px; }
.process .process-box h1{ float:left; width:100%; height:auto; font-family:milansixty; font-size:43px; color:#5D4337; line-height:43px;}
.process .process-box h2{ float:left; width:100%; height:auto; font-family:klavika medium; font-size:12px; color:#5D4337; line-height:16px;}
.process .process-box h3{ float:left; width:100%; height:auto; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:16px; }
.process .process-box .info{ float:left; width:100%; height:12px; margin-top:20px; margin-bottom:40px;}
.process .process-box .info span img{ float:left; margin-right:3px; }
.process .process-box .info span{ float:left; width:88px; height:12px; font-family:klavika regular; font-size:12px; color:#5D4337; line-height:12px; margin-right:10px; margin-bottom:20px;  }

.process-chart{ display:none; }

.process-chart-scroll{ margin:0 auto; width:100%; max-width:360px; height:auto; position:relative; display:block;}
.process-chart-scroll ol{ float:none; width:294px; height:auto; position:relative;}
.process-chart-scroll #process-scroll{ position:relative; float:left; width:294px;  }
.process-chart-scroll ol li{ position:absolute; width:auto; height:auto; font-family:klavika regular; font-size:12px; color:#5D4337; text-align:center; }
.process-chart-scroll .process-1-scroll{ left:136px; top:108px; display:none;}
.process-chart-scroll .process-1-scroll img{ width:20px; height:20px; }
.process-chart-scroll .process-1-scroll p{ position:absolute; line-height:20px; left:-30px; top:0;}
.process-chart-scroll .process-2-scroll{ left:143px; top:122px; display:none;}
.process-chart-scroll .process-2-scroll img{ width:41px; height:41px; }
.process-chart-scroll .process-2-scroll p{ position:absolute; line-height:41px; right:-50px; top:0;}
.process-chart-scroll .process-3-scroll{ left:135px; top:155px; display:none;}
.process-chart-scroll .process-3-scroll img{ width:57px; height:57px; }
.process-chart-scroll .process-3-scroll p{ position:absolute; line-height:57px; right:-70px; top:0;}
.process-chart-scroll .process-4-scroll{ left:105px; top:191px; display:none;}
.process-chart-scroll .process-4-scroll img{ width:57px; height:57px; }
.process-chart-scroll .process-4-scroll p{ position:absolute; line-height:57px; left:-105px; top:0;}
.process-chart-scroll .process-5-scroll{ left:141px; top:225px; display:none;}
.process-chart-scroll .process-5-scroll img{ width:45px; height:45px; }
.process-chart-scroll .process-5-scroll p{ position:absolute; line-height:45px; right:-52px; top:0;}
.process-chart-scroll .process-6-scroll{ left:99px; top:251px; display:none;}
.process-chart-scroll .process-6-scroll img{ width:69px; height:69px; }
.process-chart-scroll .process-6-scroll p{ position:absolute; line-height:16px; left:-95px; top:17px; width:90px;}
.process-chart-scroll .process-7-scroll{ left:109px; top:311px; display:none;}
.process-chart-scroll .process-7-scroll img{ width:51px; height:51px; }
.process-chart-scroll .process-7-scroll p{ position:absolute; line-height:16px; left:-70px; top:10px; width:70px;}
.process-chart-scroll .process-8-scroll{ left:131px; top:353px; display:none;}
.process-chart-scroll .process-8-scroll img{ width:66px; height:66px; }
.process-chart-scroll .process-8-scroll p{ position:absolute; line-height:16px; right:-60px; top:18px; width:50px;}
.process-chart-scroll .process-9-scroll{ left:112px; top:401px; display:none;}
.process-chart-scroll .process-9-scroll img{ width:41px; height:41px; }
.process-chart-scroll .process-9-scroll p{ position:absolute; line-height:41px; left:-90px; top:0;}
.process-chart-scroll .process-10-scroll{ left:125px; top:425px; display:none;}
.process-chart-scroll .process-10-scroll img{ width:78px; height:78px; }
.process-chart-scroll .process-10-scroll p{ position:absolute; line-height:16px; right:-91px; top:25px; width:100px;}
.process-chart-scroll .process-11-scroll{ left:138px; top:499px; display:none;}
.process-chart-scroll .process-11-scroll img{ width:18px; height:18px; }
.process-chart-scroll .process-11-scroll p{ position:absolute; line-height:18px; right:-68px; top:0;}
.process-chart-scroll .process-12-scroll{ left:109px; top:513px; display:none;}
.process-chart-scroll .process-12-scroll img{ width:51px; height:51px; }
.process-chart-scroll .process-12-scroll p{ position:absolute; line-height:16px; left:-120px; top:10px; width:120px;}
.process-chart-scroll .process-13-scroll{ left:132px; top:549px; display:none;}
.process-chart-scroll .process-13-scroll img{ width:63px; height:63px; }
.process-chart-scroll .process-13-scroll p{ position:absolute; line-height:63px; right:-90px; top:0;}
.process-chart-scroll .process-14-scroll{ left:114px; top:597px; display:none;}
.process-chart-scroll .process-14-scroll img{ width:42px; height:42px; }
.process-chart-scroll .process-14-scroll p{ position:absolute; line-height:42px; left:-117px; top:0;}
.process-chart-scroll .process-15-scroll{ left:116px; top:621px; display:none;}
.process-chart-scroll .process-15-scroll img{ width:139px; height:139px; }
.process-chart-scroll .process-15-scroll p{ position:absolute; line-height:18px; right:-35px; top:45px; width:30px;}
.process-chart-scroll .process-16-scroll{ left:98px; top:737px; display:none;}
.process-chart-scroll .process-16-scroll img{ width:75px; height:75px; }
.process-chart-scroll .process-16-scroll p{ position:absolute; line-height:75px; left:-99px; top:0;}
.process-chart-scroll .process-17-scroll{ left:136px; top:788px; display:none;}
.process-chart-scroll .process-17-scroll img{ width:89px; height:89px; }
.process-chart-scroll .process-17-scroll p{ position:absolute; line-height:18px; right:-50px; top:30px; width:50px;}
.process-chart-scroll .process-18-scroll{ left:120px; top:854px; display:none;}
.process-chart-scroll .process-18-scroll img{ width:31px; height:31px; }
.process-chart-scroll .process-18-scroll p{ position:absolute; line-height:31px; left:-41px; top:0;}
.process-chart-scroll .process-19-scroll{ left:147px; top:865px; display:none;}
.process-chart-scroll .process-19-scroll img{ width:101px; height:101px; }
.process-chart-scroll .process-19-scroll p{ position:absolute; line-height:18px; right:-46px; top:30px; width:50px;}
.process-chart-scroll .process-20-scroll{ left:147px; top:942px; display:none;}
.process-chart-scroll .process-20-scroll img{ width:101px; height:101px; }
.process-chart-scroll .process-20-scroll p{ position:absolute; line-height:18px; right:-46px; top:30px; width:50px;}
.process-chart-scroll .process-21-scroll{ left:141px; top:1031px; display:none;}
.process-chart-scroll .process-21-scroll img{ width:60px; height:60px; }
.process-chart-scroll .process-21-scroll p{ position:absolute; line-height:18px; right:-80px; top:15px; width:80px;}
.process-chart-scroll .process-22-scroll{ left:141px; top:1083px; display:none;}
.process-chart-scroll .process-22-scroll img{ width:41px; height:41px; }
.process-chart-scroll .process-22-scroll p{ position:absolute; line-height:41px; right:-81px; top:0;}
.process-chart-scroll .process-23-scroll{ left:126px; top:1104px; display:none;}
.process-chart-scroll .process-23-scroll img{ width:29px; height:29px; }
.process-chart-scroll .process-23-scroll p{ position:absolute; line-height:29px; left:-69px; top:0;}
.process-chart-scroll .process-24-scroll{ left:133px; top:1123px; display:none;}
.process-chart-scroll .process-24-scroll img{ width:44px; height:44px; }
.process-chart-scroll .process-24-scroll p{ position:absolute; line-height:44px; right:-44px; top:0;}
.process-chart-scroll .process-25-scroll{ left:128px; top:1158px; display:none;}
.process-chart-scroll .process-25-scroll img{ width:21px; height:21px; }
.process-chart-scroll .process-25-scroll p{ position:absolute; line-height:21px; left:-41px; top:0;}
.process-chart-scroll .process-26-scroll{ left:137px; top:1175px; display:none;}
.process-chart-scroll .process-26-scroll img{ width:21px; height:21px; }
.process-chart-scroll .process-26-scroll p{ position:absolute; line-height:21px; right:-41px; top:0;}
.process-chart-scroll .process-27-scroll{ left:147px; top:1215px; display:none;}
.process-chart-scroll .process-27-scroll img{ width:34px; height:34px; }
.process-chart-scroll .process-27-scroll p{ position:absolute; line-height:18px; right:-111px; top:2px; width:105px;}
.process-chart-scroll .process-28-scroll{ left:141px; top:1249px; display:none;}
.process-chart-scroll .process-28-scroll img{ width:13px; height:13px; }
.process-chart-scroll .process-28-scroll p{ position:absolute; line-height:13px; left:-110px; top:0; }
.process-chart-scroll .process-29-scroll{ left:127px; top:1329px; display:none;}
.process-chart-scroll .process-29-scroll img{ width:21px; height:21px; }
.process-chart-scroll .process-29-scroll p{ position:absolute; line-height:18px; left:-111px; top:-5px; width:105px;  }
.process-chart-scroll .process-30-scroll{ left:147px; top:1352px; display:none;}
.process-chart-scroll .process-30-scroll img{ width:21px; height:21px; }
.process-chart-scroll .process-30-scroll p{ position:absolute; line-height:18px; right:-111px; top:-5px; width:105px; }

.process-chart-scroll .process-text-scroll{ float:left; width:161px; height:1450px; margin-top:35px; margin-left:66px;   }
.process-chart-scroll .process-text-scroll .dot{ border-right:#555 dotted 1px; }
.process-chart-scroll .process-text-scroll span{ margin-right:10px; }
.process-chart-scroll .process-text-scroll p{ float:left; width:80px; height:100%; font-family:milansixty; font-size:32px; color:#5D4337; line-height:32px; text-align:center; }
}
