@charset "utf-8";
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block}
audio,canvas,video{display:inline-block}
audio:not([controls]){display:none;height:0}
[hidden]{display:none}
html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
body{margin:0}
a:focus{outline:thin dotted}
a:active,a:hover{outline:0}
h1{font-size:2em}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
dfn{font-style:italic}
mark{background:#ff0;color:#000}
code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}
pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}
q{quotes:"\201C" "\201D" "\2018" "\2019"}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:0}
fieldset{border:1px solid silver;margin:0 2px;padding:0.35em 0.625em 0.75em}
legend{border:0;padding:0}
button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}
button,input{line-height:normal}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],input[disabled]{cursor:default}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
textarea{overflow:auto;vertical-align:top}
table{border-collapse:collapse;border-spacing:0}
.cf:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
.avoid-clicks{ pointer-events: none; }

* { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
body { margin:0; padding:0; font-family: "mrs-eaves", "Georgia", Times, sans-serif; font-size:12px; -webkit-font-smoothing:antialiased; -webkit-transition:background-color 1s ease-out;-moz-transition:background-color 1s ease-out;-ms-transition:background-color 1s ease-out;-o-transition:background-color 1s ease-out;transition:background-color 1s ease-out  }
.smart-object { position:absolute; top:0; left:0; }
.t-center { text-align: center !important; }
input,textarea { outline:0; resize:none; }
h1,h2,h3,h4,h5,h6,p { font-weight:400; margin:0; padding:0; }
ul { margin:0; padding:0; list-style:none; }
ul li { margin:0; padding:0; display:block; }
strong { letter-spacing:-.05em; }
@-webkit-keyframes arrowSlideBorder {0% { background-position:-1px -1px; }50% { background-position:26px -1px; }50.1% { background-position:-28px -1px; }100% { background-position:-1px -1px; }}
@-moz-keyframes arrowSlideBorder {0% { background-position:-1px -1px; }50% { background-position:26px -1px; }50.1% { background-position:-28px -1px; }100% { background-position:-1px -1px; }}

#progress { position: fixed; left:0; top:0; right: 0; bottom: 0; background-color: #f1efea; z-index: 9999; }
#progressBar { position: absolute; left:50%; top:50%; margin:-25px 0 0 -50px; width: 100px; height: 50px; z-index: 2; }
#progressBar span { position: absolute; right:0; top:0; display: block; width: 100%; height: 100%; background:#f1efea; opacity: .9; }
#progressLogo { position: absolute; left:50%; top:50%; margin:-25px 0 0 -50px; width: 100px; height: 50px; }
#progressLogo svg { display: block; width: 100%; height: 100%; fill:#444; }
@media (min-width: 960px){
	#progressBar { margin:-50px 0 0 -100px; width: 200px; height: 100px; }
	#progressLogo { margin:-50px 0 0 -100px; width: 200px; height: 100px; }
}


body { background-color:#fff; color:#000; }
body a { color:#000; }
@media all and (max-width:760px) {
	body,html { width:100%; }
}
a.arrow-a { position: relative; line-height: 1.4; display: inline-block; color:#000; }
a.arrow-a span { position: relative; display: inline-block; overflow: hidden; }
a.arrow-a .round { position: absolute; display: inline-block; right: 0; bottom:7px; width: 15px; height: 15px; background: #000; margin: 0; border-radius: 50%;}
a.arrow-a .round svg { position: absolute; left:0; top:0; width: 7px; height: 7px; margin: 4px; fill:#fff; }
a.arrow-a span:after, a.arrow-a span:before { position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 1px; background: #1f1f1f;}
a.arrow-a span:before { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); transition: -webkit-transform .9s cubic-bezier(.19,1,.22,1) .2s; transition: transform .9s cubic-bezier(.19,1,.22,1) .2s;}
a.arrow-a span:after { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); transition: -webkit-transform .7s cubic-bezier(.19,1,.22,1); transition: transform .7s cubic-bezier(.19,1,.22,1);}
a.arrow-a:hover span:before { -webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);transition:-webkit-transform .7s cubic-bezier(.19,1,.22,1);transition:transform .7s cubic-bezier(.19,1,.22,1)}
a.arrow-a:hover span:after {-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);transition:-webkit-transform .9s cubic-bezier(.19,1,.22,1) .2s;transition:transform .9s cubic-bezier(.19,1,.22,1) .2s}


.site-column-left { position:fixed; width:200px; top:0; left:0; height:100%; z-index:4; background-color:#fff; border-right: 1px solid #eee; }
.site-column-right { position:relative; width:100%; height:100%; padding:0 0 0 200px; }
@media all and (max-width:960px) {
	.site-column-left { width:100%; height:0;}
	.site-column-right { padding:70px 0 0; left:0; width:100%; float:none; }
}

.logo-container { width:125px; height:220px; margin:0 auto; }
.logo { width:125px; height:150px; padding:40px 0; text-indent:-9999px; overflow:hidden; display:block; }
.logo svg { display: block; margin:0 auto; }
.logo .svg-logo { width: 100px; height: 50px; }
.logo .svg-logo-text { width: 120px; height: 10px; margin-top: 2px; }
.logo-text { width:125px; height: 70px; margin:0 auto; padding:17px 0; border-top: 1px solid #999; border-bottom: 2px solid #000; }
.logo-text h1 { font-size: 12px; color:#8e7d60; line-height: 18px; text-transform: uppercase; }
.logo-text h1 b { display: block; }
.nav { position: absolute; left:0; top:220px; right:0; bottom:0; width:200px; text-align: left; }
.nav .nav-container { width:125px; height:210px; margin:60px auto 0; display:block; }
.nav .link-container { position: relative; width:125px; height:210px; }
.nav .link-container li { margin:4px 0; border-bottom: 1px solid #fff; }
.nav .link-container li a { color:#111; line-height: 28px; font-size:13px; letter-spacing: 1px; text-decoration:none; display:block; -webkit-transition:color .2s linear; -moz-transition:color .2s linear; transition:color .2s linear; }
.nav .link-container li a span { position: relative; display: inline-block; width: 20px; }
.nav .link-container li a span svg { position: absolute; left:0; top:50%; margin-top: -12px; width: 14px; height: 14px; -webkit-transition:fill .2s linear; -moz-transition:fill .2s linear; transition:fill .2s linear; }
.nav .link-container li a:hover,
.nav .link-container li.current a { color:#8e7d60; }
.nav .link-container li a:hover span svg { fill:#8e7d60; }
.nav .nav-bottom { position: absolute; left:0; bottom:0; width: 100%; }
.nav .nav-bottom .n-mail { width:125px; margin:0 auto; padding: 0; font-size: 14px; display: block; }
.nav .nav-bottom .n-mail span { display: block; margin-bottom: 5px; }
.nav .nav-bottom .n-mail a { position: relative; display: inline-block; font-weight: 700; color:#111; }
.nav .nav-bottom .copyright { display: block; font-size: 14px; color:#444; width:125px; margin:0 auto; padding:30px 0 40px; }
.link-container li:last-child { position: absolute; top:0; right: 0; margin: 0; width: 28px; height: 28px; -webkit-transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; }
.link-container li:last-child::before { content: ''; position: absolute; left: 50%; top: 50%; margin: -2px 0 0 -8px; width: 16px; height: 16px; border-radius: 50%; background: #f1efea url(../img/arrow.gif) center center no-repeat; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.link-container li:last-child::after { content:""; }
.link-container li.current:first-child ~ li:last-child { -webkit-transform: translateY(0); transform: translateY(0); }
.link-container li.current:nth-child(2) ~ li:last-child { -webkit-transform: translateY(33px); transform: translateY(33px); }
.link-container li.current:nth-child(3) ~ li:last-child { -webkit-transform: translateY(66px); transform: translateY(66px); }
.link-container li.current:nth-child(4) ~ li:last-child { -webkit-transform: translateY(99px); transform: translateY(99px); }
.nav-trigger { display: none; }


@media all and (max-width:960px) {
	.logo-container { width:100%; height:70px; margin:0; background-color: #fff; border-bottom: 1px solid #eee; }
	.logo { width: 90px; height: 70px; margin:0 auto; padding:10px 0; background-repeat:no-repeat; text-indent:-9999px; overflow:hidden; }
	.logo .svg-logo { width: 70px; height:35px; }
	.logo .svg-logo-text { width: 90px; }
	.logo-text { display: none; }
	.nav { width:100%; position:fixed; top:70px; left:-100%; background-color: #fff; -webkit-transition:left .6s cubic-bezier(.7,0,.3,1);-moz-transition:left .6s cubic-bezier(.7,0,.3,1);-ms-transition:left .6s cubic-bezier(.7,0,.3,1);-o-transition:left .6s cubic-bezier(.7,0,.3,1);transition:left .6s cubic-bezier(.7,0,.3,1); }
	.nav .nav-container { margin:0; padding:40px 25px; display:block; width:100%; height: auto; z-index:99; top:0; position:absolute; overflow-y:scroll; -webkit-overflow-scrolling:touch;}
	.nav .link-container { width: 100%; }
	.nav .link-container li a { font-size:12px; height:21px; }
	.nav .nav-bottom .n-mail { width: 100%; padding:0 25px; }
	.nav .nav-bottom .copyright { width: 100%; padding: 25px; }
	.nav-trigger { display: block; width:50px; height:100%; cursor:pointer; }
	.nav-trigger .hamburger { position:absolute; top:50%; top:34px; left:20px; width:24px; height:16px; -webkit-transform:translate(0,-50%); -ms-transform:translate(0,-50%); transform:translate(0,-50%); }
	.nav-trigger .hamburger .line { position:absolute; top:0; left:0; width:100%; height:100%; margin-top:0; -ms-transform:translate(0,0%); -webkit-transform:translate3d(0,0%,0); transform:translate3d(0,0%,0); -webkit-transition:width 222ms cubic-bezier(.215,.61,.355,1)444ms,margin-top 222ms cubic-bezier(.215,.61,.355,1)222ms,-webkit-transform 222ms cubic-bezier(.215,.61,.355,1)222ms; transition:width 222ms cubic-bezier(.215,.61,.355,1)444ms,margin-top 222ms cubic-bezier(.215,.61,.355,1)222ms,transform 222ms cubic-bezier(.215,.61,.355,1)222ms; }
	.nav-trigger .hamburger .line span { position:absolute; top:0; left:0; width:100%; height:2px; background-color:#958b74; -ms-transform:rotate(0); -webkit-transform:rotate(0)translate3d(0,0,0); transform:rotate(0)translate3d(0,0,0); -webkit-transition:-webkit-transform 222ms cubic-bezier(.215,.61,.355,1); transition:transform 222ms cubic-bezier(.215,.61,.355,1); }
	.nav-trigger .hamburger .line:nth-child(2) { width:50%; margin-top:-1px; -ms-transform:translate(0,50%); -webkit-transform:translate3d(0,50%,0); transform:translate3d(0,50%,0); }
	.nav-trigger .hamburger .line:nth-child(3) { width:75%; margin-top:-2px; -ms-transform:translate(0,100%); -webkit-transform:translate3d(0,100%,0); transform:translate3d(0,100%,0); }
	.nav-trigger .hamburger .line:nth-child(3) span { visibility:visible; -webkit-transition:visibility linear 222ms; transition:visibility linear 222ms; }
	.show { height: 100%; overflow: hidden; }
	.show .nav-trigger .hamburger .line { margin-top:-1px; width:100%; -ms-transform:translate(0,50%); -webkit-transform:translate3d(0,50%,0); transform:translate3d(0,50%,0); -webkit-transition:width 222ms cubic-bezier(.215,.61,.355,1),margin-top 222ms cubic-bezier(.215,.61,.355,1)222ms,-webkit-transform 222ms cubic-bezier(.215,.61,.355,1)222ms; transition:width 222ms cubic-bezier(.215,.61,.355,1),margin-top 222ms cubic-bezier(.215,.61,.355,1)222ms,transform 222ms cubic-bezier(.215,.61,.355,1)222ms; }
	.show .nav-trigger .hamburger .line span { -webkit-transition:-webkit-transform 222ms cubic-bezier(.215,.61,.355,1)444ms; transition:transform 222ms cubic-bezier(.215,.61,.355,1)444ms; }
	.show .nav-trigger .hamburger .line:nth-child(1) span { -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg)translate3d(0,0,0); transform:rotate(45deg)translate3d(0,0,0); }
	.show .nav-trigger .hamburger .line:nth-child(2) span { -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg)translate3d(0,0,0); transform:rotate(-45deg)translate3d(0,0,0); }
	.show .nav-trigger .hamburger .line:nth-child(3) span { visibility:hidden; -webkit-transition:visibility linear 444ms; transition:visibility linear 444ms; }
	.show .nav { left:0; }
}


@media all and (min-width: 320px){
	a { outline:0 none; text-decoration:none; }
	a:focus { outline:none; }
	ul,li { margin:0; padding:0; list-style-type:none; }
	section { position:relative; width:100%; margin:0; padding:0; display:block; overflow: hidden; }
	.section-inner { position:relative; width:100%; max-width:1080px; padding:0 20px; margin:0 auto; display:block; }
	.section-inner hr { margin:10px 0; height:1px; border:none; outline:none; display:block; }
	.section-title { margin:40px 0 20px; padding:20px 0; border-top: 1px solid #a7987e; border-bottom: 2px solid #a7987e; text-align: left; }
	.section-title.b2 { border-top: none; border-bottom: 1px solid #a7987e; }
	h2 { font-size: 30px; color:#8e7d60; }
	h2 span { display: block; font-size: 12px; }
	h3 { font-size: 14px; margin-top: 10px; color:#6e6b62; }
}
@media all and (min-width: 768px){
	.section-inner { padding:0 40px; }
	.section-inner hr{ margin:20px 0; height:1px; }
	.section-title { margin:60px 0 0; width: 36%; }
	.section-title.b2 { width: 100%; }
	.section-title.b3 { float: right; }
}
@media all and (min-width: 960px){
	.section-title { margin:80px 0 0; }
	h2 { font-size: 36px; }
	h2 span { display: block; font-size: 14px; }
	h3 { font-size: 15px; }
}


@media only screen and (min-width: 320px) {
	.hero-home { position: relative; display: block; background-color: #000 }
	#section-learn,.photos,.photos .photo,.content-table { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; }
	.photos { width: 100%; height: 100%; left:auto; right:0; }
	.photos .photo img { position: absolute; top:50%; left:50%; opacity: 1; filter:alpha(opacity=80) }
	.row { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 2; }
	.row .cell { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: table; overflow: hidden; -webkit-transition: bottom 300ms ease-in-out; -moz-transition: bottom 300ms ease-in-out; -o-transition: bottom 300ms ease-in-out; transition: bottom 300ms ease-in-out; }
	.row .cell .callout { display: table-cell; vertical-align: middle; text-align: center; }
	.row .cell .callout svg { display: block; width: 100px; height: 20px; margin:0 auto; fill:#fff; }
	.row .cell .callout p { font-size: 18px; line-height: 1; letter-spacing: 1px; color:#fff; }
	.timer-strip { width: 100%; height: 50px; display: block; position: absolute; bottom: 0; right: 0; z-index: 3; cursor: pointer; }
	.timer-strip .bar { position: absolute; left:0; bottom:0; display: block; width: 0; height: 5px; background-color: rgba(255,255,255,0.6); }
	.timer-strip .now,
	.timer-strip .all { position: absolute; top:0; right:50px; line-height: 20px; font-size: 14px; color:#fff; display: block; width: 20px; text-align: center; }
	.timer-strip .now { margin-right: 2px; }
	.timer-strip .all { margin-right: -22px; }
	.timer-strip .per { position: absolute; top:4px; right:50px; display: block; width: 1px; height: 12px; background-color: #fff; -webkit-transform: rotate(30deg); -moz-transform: rotate(30deg); -ms-transform: rotate(30deg); -o-transform: rotate(30deg); transform: rotate(30deg); }
}
@media (min-width:768px){
	.hero-home { display: block; }
	.photos { width: 100%; height: 100%; left:auto; right:0; }
	.row .cell { border-top: none; }
	.row .cell .callout svg { width: 150px; height: 30px; }
	.row .cell .callout p { font-size: 24px; letter-spacing: 2px; }
}

.bg-beige { position: relative; display: block; margin:0; padding:1px 0; background-color: #f1efea; }
.bg-lightgray { position: relative; display: block; margin:0; padding:1px 0; background-color: #f6f6f6; background:linear-gradient(to top,#ffffff 0%,#f1efea 60%,#ffffff 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1efea',endColorstr='#ffffff',GradientType=1); }
.bg-img { position: relative; display: block; width: 100%; }
.bg-img img { display: block; width: 100%; }
@media only screen and (min-width: 320px) {
	.heritage { display: block; }
	.heritage .img { display: block; }
	.heritage .img img { display: block; width: 100%; }
	.heritage .text { position: relative; display: block; padding:10px 0; text-align: left; }
	.heritage .text p { font-size: 13px; margin:20px 0; }
}
@media (min-width:768px){
	.heritage .img { width: 60%; float: left; padding:40px 0 80px; }
	.heritage .text { width: 36%; float: right; padding:20px 0 60px; }
	.heritage .text:before { content:""; position: absolute; left:0; top:-2px; width: 100%; height: 2px; background-color: #a7987e; }
}
@media (min-width:960px){
	.heritage .text p { font-size: 15px; }
}


@media only screen and (min-width: 320px) {
	.position { position: relative; width: 100%; height: 600px; margin:40px 0; }
	.position:before { content:""; position: absolute; left:5%; top:0%; width: 90%; height: 100%; background-color: rgba(150,150,150,0.1); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(-20deg); -moz-transform: rotate(-20deg); transform: rotate(-20deg); }
	.position .line-y { position: absolute; left:50%; top:5%; width: 1px; height: 90%; background-color: rgba(0,0,0,0.2); }
	.position .line-x { position: absolute; left:15%; top:50%; width: 70%; height: 1px; background-color: rgba(0,0,0,0.2); }
	.position .abs-text { position: absolute; text-align: center; width: 120px; font-size: 11px; line-height: 20px; height: 20px; text-transform: uppercase; display: block; }
	.position .abs-text.abs-top { top:0; left:50%; margin-left: -60px; }
	.position .abs-text.abs-left { left:0; top:50%; margin-top: -10px; text-align: left; }
	.position .abs-text.abs-right { right:0; top:50%; margin-top: -10px; text-align: right; }
	.position .abs-text.abs-bottom { bottom:0; left:50%; margin-left: -60px; }
	.position .product-i { position: absolute; background-color: rgba(0,0,0,0.1); background-position: center; background-repeat: no-repeat; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; }
	.position .product-stredd { left:25%; top:40%; width: 100px; height: 100px; margin-left: -50px; margin-top: -50px; background-size: 53px 53px; background-image: url(../img/p_stred.png); }
	.position .product-mdcosme { left:40%; bottom:40%; width: 200px; height: 200px; margin-left: -100px; margin-bottom: -100px; background-size: 110px 110px; background-image: url(../img/p_md.png); }
	.position .product-labo { right:41%; top:43%; width: 100px; height: 100px; margin-right: -50px; margin-top: -50px; background-size: 52px 52px; background-image: url(../img/p_labo.png); }
	.position .product-finggy { right:15%; bottom:25%; width: 90px; height: 90px; margin-right: -45px; margin-bottom: -45px; background-size: 53px 53px; background-image: url(../img/p_finggy.png); }
	.position .product-stredd { background-color: rgba(215,94,110,0.3)!important; }
	.position .product-mdcosme { background-color: rgba(120,159,101,0.3)!important; }
	.position .product-labo { background-color: rgba(221,215,37,0.3)!important; }
	.position .product-finggy { background-color: rgba(101,132,184,0.3)!important; }
}
@media only screen and (min-width: 768px) {
	.position { height: 540px; }
	.position:before { left:8%; top:10%; width: 84%; height: 80%; -webkit-transform: rotate(20deg); -moz-transform: rotate(20deg); transform: rotate(20deg); }
	.position .line-x { left:8%; width: 84%; }
	.position .product-stredd { width: 180px; height: 180px; margin-left: -120px; margin-top: -140px; background-size: 107px 107px; }
	.position .product-mdcosme { width: 320px; height: 320px; margin-left: -150px; margin-bottom: -150px; background-size: 220px 220px; }
	.position .product-labo { width: 180px; height: 180px; margin-right: -60px; margin-top: -130px; background-size: 120px 120px; }
	.position .product-finggy { width: 140px; height: 140px; margin-right: -40px; margin-bottom: -70px; background-size: 100px 100px; }
}
@media only screen and (min-width: 960px) {
	.position .abs-text { font-size: 14px; }
	.position .abs-text.abs-top { width: 180px; margin-left: -90px; }
	.position .product-stredd { margin-left: -110px; }
}

@media only screen and (min-width: 320px) {
	.histor { display: block; padding:40px 0; text-align: center; }
	.histor .timeline { position: relative; width: 100%; height: 100px; margin-top: 40px; border-top: 2px solid #a7987e; }
	.histor .timeline>div { position: absolute; top:0; width: 40px; }
	.histor .timeline>div:before,
	.histor .timeline>div:after { content:""; position: absolute; left:50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
	.histor .timeline>div:before { background-color: #f1efea; width: 12px; height: 12px; top:-7px; margin-left: -6px; }
	.histor .timeline>div:after { background-color: #a7987e; width: 6px; height: 6px; top:-4px; margin-left: -3px; }
	.histor .timeline>div span { line-height: 3; color:#8e7d60; display: inline-block; }
	.histor .timeline>div h4 { position: absolute; top:40px; left:50%; width: 80px; margin-left: -40px; font-size: 12px; }
	.histor .timeline .t-01 { left:1%; }
	.histor .timeline .t-02 { left:15%; }
	.histor .timeline .t-03 { left:50%; }
	.histor .timeline .t-04 { left:76%; }
	.histor .timeline .t-05 { right:1%; }
}
@media only screen and (min-width: 768px) {
	.histor { padding:70px 0; }
	.histor .timeline>div span { font-size: 14px; }
	.histor .timeline>div h4 { top:50px; width: 100px; margin-left: -50px; font-size: 14px; }
	.histor .timeline .t-01 { left:2%; }
}

@media only screen and (min-width: 320px){
	.products { padding-bottom: 40px; }
	.products .col { width: 48%; float: left; display: block; margin-bottom: 20px; }
	.products .col:nth-child(even) { margin-left: 2%; }
	.products .col:nth-child(odd) { margin-right: 2%; }
	.products .col img { display: block; width: 100%; }
	.products .col img.logo01 { width: 120px; height: 50px; margin: 10px auto; overflow: hidden; display: block; }
}
@media only screen and (min-width: 768px) {
	.products .col { width: 23.5%; margin:0 0 0 2% !important; }
	.products .col:first-child { margin-left: 0% !important; }
	.products .col img.logo01 { margin:20px auto; }
}


@media only screen and (min-width: 320px) {
	.about { display: block; }
	.about .img { position: relative; display: block; }
	.about .img img { display: block; width: 100%; }
	.about .text { position: relative; display: block; padding:10px 0; text-align: left; }
	.about .text p { font-size: 13px; margin:20px 0; }
}
@media (min-width:768px){
	.about .img { width: 36%; float: left; padding:40px 0; }
	.about .text { width: 60%; float: right; padding:20px 0; }
	.about .img:before { content:""; position: absolute; left:0; top:-2px; width: 100%; height: 2px; background-color: #a7987e; }
}
@media (min-width:960px){
	.about .text p { font-size: 15px; }
}

@media only screen and (min-width: 320px) {
	.resume { display: block; padding:0 0 40px; }
	.resume .img { display: block; }
	.resume .img img { display: block; width: 100%; }
	.resume .text { position: relative; display: block; padding:10px 0 30px; text-align: left; }
	.resume .text h3 { font-size: 16px; padding-bottom: 20px; margin:20px 0; color:#8e7d60; border-bottom: 1px solid #a7987e; }
	.resume .text table { width: 100%; }
	.resume .text table th,
	.resume .text table td { font-size: 13px; vertical-align: top; padding:5px 0; }
	.resume .text table th { width: 70px; color:#666; }
}
@media (min-width:768px){
	.resume .img { width: 60%; float: right; padding:40px 0 80px; }
	.resume .text { width: 36%; float: left; padding:20px 0 60px; }
}
@media (min-width:960px){
	.resume .text h3 { font-size: 20px; }
}