@CHARSET "UTF-8";

html {font-size:62.5%;font-family: 'Noto Sans KR', sans-serif; }
body {font-size:1em; line-height:1.5}
address, em {font-style:normal}
img {max-width:100%; height:auto; vertical-align:top; -ms-interpolation-mode:bicubic}
em.red {color:#e53935}
.l-wrap {position:relative; margin-left:20px; margin-right:20px}
@media (min-width:45em) {
.l-wrap {margin-left:4.29688%; margin-right:4.29688%}}
.l-wrap-until-md {position:relative; margin-left:20px; margin-right:20px}
@media (min-width:45em) {
.l-wrap-until-md {margin:0; max-width:none}}
.l-wrap-sm {position:relative}
@media (max-width:34.99em) {
.l-wrap-sm {overflow:hidden}}
@media (min-width:35em) {
.l-wrap-sm {margin-left:20px; margin-right:20px}}
.l-wrap-md {position:relative}
@media (max-width:44.99em) {
.l-wrap-md {overflow:hidden}}
.l-wrap-lg {position:relative}
@media (max-width:59.99em) {
.l-wrap-lg {overflow:hidden}}
@media (min-width:60em) {
.l-wrap-lg {margin-left:4.29688%; margin-right:4.29688%}}
@media (min-width:45em) {
.l-wrap-md, .l-wrap-sm {margin-left:4.29688%; margin-right:4.29688%}}
@media (min-width:80em) {
.l-wrap, .l-wrap-lg, .l-wrap-md, .l-wrap-sm {margin-left:auto; margin-right:auto; max-width:1170px}}
.row {zoom:1; margin-left:-8px; margin-right:-8px}
.row:before {content:''; display:block}
.row:after {content:''; display:table; clear:both}
@media (min-width:45em) {
.row {margin-left:-9px; margin-right:-9px}}
@media (min-width:60em) {
.row {margin-left:-15px; margin-right:-15px}}
.col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-l-1, .col-l-10, .col-l-11, .col-l-12, .col-l-2, .col-l-3, .col-l-4, .col-l-5, .col-l-6, .col-l-7, .col-l-8, .col-l-9, .col-s-1, .col-s-10, .col-s-11, .col-s-12, .col-s-2, .col-s-3, .col-s-4, .col-s-5, .col-s-6, .col-s-7, .col-s-8, .col-s-9 {position:relative; min-height:1px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; padding-left:8px; padding-right:8px}
.col-s-1 {float:left; width:8.33333%}
.col-s-offset-1 {margin-left:8.33333%}
.col-s-pull-1 {right:8.33333%}
.col-s-push-1 {left:8.33333%}
.col-s-2 {float:left; width:16.66667%}
.col-s-offset-2 {margin-left:16.66667%}
.col-s-pull-2 {right:16.66667%}
.col-s-push-2 {left:16.66667%}
.col-s-3 {float:left; width:25%}
.col-s-offset-3 {margin-left:25%}
.col-s-pull-3 {right:25%}
.col-s-push-3 {left:25%}
.col-s-4 {float:left; width:33.33333%}
.col-s-offset-4 {margin-left:33.33333%}
.col-s-pull-4 {right:33.33333%}
.col-s-push-4 {left:33.33333%}
.col-s-5 {float:left; width:41.66667%}
.col-s-offset-5 {margin-left:41.66667%}
.col-s-pull-5 {right:41.66667%}
.col-s-push-5 {left:41.66667%}
.col-s-6 {float:left; width:50%}
.col-s-offset-6 {margin-left:50%}
.col-s-pull-6 {right:50%}
.col-s-push-6 {left:50%}
.col-s-7 {float:left; width:58.33333%}
.col-s-offset-7 {margin-left:58.33333%}
.col-s-pull-7 {right:58.33333%}
.col-s-push-7 {left:58.33333%}
.col-s-8 {float:left; width:66.66667%}
.col-s-offset-8 {margin-left:66.66667%}
.col-s-pull-8 {right:66.66667%}
.col-s-push-8 {left:66.66667%}
.col-s-9 {float:left; width:75%}
.col-s-offset-9 {margin-left:75%}
.col-s-pull-9 {right:75%}
.col-s-push-9 {left:75%}
.col-s-10 {float:left; width:83.33333%}
.col-s-offset-10 {margin-left:83.33333%}
.col-s-pull-10 {right:83.33333%}
.col-s-push-10 {left:83.33333%}
.col-s-11 {float:left; width:91.66667%}
.col-s-offset-11 {margin-left:91.66667%}
.col-s-pull-11 {right:91.66667%}
.col-s-push-11 {left:91.66667%}
.col-s-12 {float:left; width:100%}
.col-s-offset-12 {margin-left:100%}
.col-s-pull-12 {right:100%}
.col-s-push-12 {left:100%}
.col-s-offset-0 {margin-left:0}
.col-s-pull-0 {right:auto}
.col-s-push-0 {left:auto}
@media (min-width:45em) {
.col-1, .col-l-1, .col-s-1 {padding-left:9px; padding-right:9px}
.col-2, .col-l-2, .col-s-2 {padding-left:9px; padding-right:9px}
.col-3, .col-l-3, .col-s-3 {padding-left:9px; padding-right:9px}
.col-4, .col-l-4, .col-s-4 {padding-left:9px; padding-right:9px}
.col-5, .col-l-5, .col-s-5 {padding-left:9px; padding-right:9px}
.col-6, .col-l-6, .col-s-6 {padding-left:9px; padding-right:9px}
.col-7, .col-l-7, .col-s-7 {padding-left:9px; padding-right:9px}
.col-8, .col-l-8, .col-s-8 {padding-left:9px; padding-right:9px}
.col-9, .col-l-9, .col-s-9 {padding-left:9px; padding-right:9px}
.col-10, .col-l-10, .col-s-10 {padding-left:9px; padding-right:9px}
.col-11, .col-l-11, .col-s-11 {padding-left:9px; padding-right:9px}
.col-12, .col-l-12, .col-s-12 {padding-left:9px; padding-right:9px}
.col-1 {float:left; width:8.33333%}
.col-offset-1 {margin-left:8.33333%}
.col-pull-1 {right:8.33333%}
.col-push-1 {left:8.33333%}
.col-2 {float:left; width:16.66667%}
.col-offset-2 {margin-left:16.66667%}
.col-pull-2 {right:16.66667%}
.col-push-2 {left:16.66667%}
.col-3 {float:left; width:25%}
.col-offset-3 {margin-left:25%}
.col-pull-3 {right:25%}
.col-push-3 {left:25%}
.col-4 {float:left; width:33.33333%}
.col-offset-4 {margin-left:33.33333%}
.col-pull-4 {right:33.33333%}
.col-push-4 {left:33.33333%}
.col-5 {float:left; width:41.66667%}
.col-offset-5 {margin-left:41.66667%}
.col-pull-5 {right:41.66667%}
.col-push-5 {left:41.66667%}
.col-6 {float:left; width:50%}
.col-offset-6 {margin-left:50%}
.col-pull-6 {right:50%}
.col-push-6 {left:50%}
.col-7 {float:left; width:58.33333%}
.col-offset-7 {margin-left:58.33333%}
.col-pull-7 {right:58.33333%}
.col-push-7 {left:58.33333%}
.col-8 {float:left; width:66.66667%}
.col-offset-8 {margin-left:66.66667%}
.col-pull-8 {right:66.66667%}
.col-push-8 {left:66.66667%}
.col-9 {float:left; width:75%}
.col-offset-9 {margin-left:75%}
.col-pull-9 {right:75%}
.col-push-9 {left:75%}
.col-10 {float:left; width:83.33333%}
.col-offset-10 {margin-left:83.33333%}
.col-pull-10 {right:83.33333%}
.col-push-10 {left:83.33333%}
.col-11 {float:left; width:91.66667%}
.col-offset-11 {margin-left:91.66667%}
.col-pull-11 {right:91.66667%}
.col-push-11 {left:91.66667%}
.col-12 {float:left; width:100%}
.col-offset-12 {margin-left:100%}
.col-pull-12 {right:100%}
.col-push-12 {left:100%}
.col-offset-0 {margin-left:0}
.col-pull-0 {right:auto}
.col-push-0 {left:auto}}
@media (min-width:60em) {
.col-1, .col-l-1, .col-s-1 {padding-left:15px; padding-right:15px}
.col-2, .col-l-2, .col-s-2 {padding-left:15px; padding-right:15px}
.col-3, .col-l-3, .col-s-3 {padding-left:15px; padding-right:15px}
.col-4, .col-l-4, .col-s-4 {padding-left:15px; padding-right:15px}
.col-5, .col-l-5, .col-s-5 {padding-left:15px; padding-right:15px}
.col-6, .col-l-6, .col-s-6 {padding-left:15px; padding-right:15px}
.col-7, .col-l-7, .col-s-7 {padding-left:15px; padding-right:15px}
.col-8, .col-l-8, .col-s-8 {padding-left:15px; padding-right:15px}
.col-9, .col-l-9, .col-s-9 {padding-left:15px; padding-right:15px}
.col-10, .col-l-10, .col-s-10 {padding-left:15px; padding-right:15px}
.col-11, .col-l-11, .col-s-11 {padding-left:15px; padding-right:15px}
.col-12, .col-l-12, .col-s-12 {padding-left:15px; padding-right:15px}
.col-l-1 {float:left; width:8.33333%}
.col-l-offset-1 {margin-left:8.33333%}
.col-l-pull-1 {right:8.33333%}
.col-l-push-1 {left:8.33333%}
.col-l-2 {float:left; width:16.66667%}
.col-l-offset-2 {margin-left:16.66667%}
.col-l-pull-2 {right:16.66667%}
.col-l-push-2 {left:16.66667%}
.col-l-3 {float:left; width:25%}
.col-l-offset-3 {margin-left:25%}
.col-l-pull-3 {right:25%}
.col-l-push-3 {left:25%}
.col-l-4 {float:left; width:33.33333%}
.col-l-offset-4 {margin-left:33.33333%}
.col-l-pull-4 {right:33.33333%}
.col-l-push-4 {left:33.33333%}
.col-l-5 {float:left; width:41.66667%}
.col-l-offset-5 {margin-left:41.66667%}
.col-l-pull-5 {right:41.66667%}
.col-l-push-5 {left:41.66667%}
.col-l-6 {float:left; width:50%}
.col-l-offset-6 {margin-left:50%}
.col-l-pull-6 {right:50%}
.col-l-push-6 {left:50%}
.col-l-7 {float:left; width:58.33333%}
.col-l-offset-7 {margin-left:58.33333%}
.col-l-pull-7 {right:58.33333%}
.col-l-push-7 {left:58.33333%}
.col-l-8 {float:left; width:66.66667%}
.col-l-offset-8 {margin-left:66.66667%}
.col-l-pull-8 {right:66.66667%}
.col-l-push-8 {left:66.66667%}
.col-l-9 {float:left; width:75%}
.col-l-offset-9 {margin-left:75%}
.col-l-pull-9 {right:75%}
.col-l-push-9 {left:75%}
.col-l-10 {float:left; width:83.33333%}
.col-l-offset-10 {margin-left:83.33333%}
.col-l-pull-10 {right:83.33333%}
.col-l-push-10 {left:83.33333%}
.col-l-11 {float:left; width:91.66667%}
.col-l-offset-11 {margin-left:91.66667%}
.col-l-pull-11 {right:91.66667%}
.col-l-push-11 {left:91.66667%}
.col-l-12 {float:left; width:100%}
.col-l-offset-12 {margin-left:100%}
.col-l-pull-12 {right:100%}
.col-l-push-12 {left:100%}
.col-l-offset-0 {margin-left:0}
.col-l-pull-0 {right:auto}
.col-l-push-0 {left:auto}}

@media (min-width:45em) {
.h1, h1 {font-size:5em}}
.h2, h2 {font-size:2.6em; line-height:1.2; letter-spacing:-.01em}
@media (min-width:45em) {
.h2, h2 {font-size:4em}}
.h3, h3 {font-size:2.4em; line-height:1.2; letter-spacing:-.01em}
@media (min-width:45em) {
.h3, h3 {font-size:3.6em}}
.h4, h4 {font-size:2.2em; line-height:1.3; letter-spacing:-.01em}
@media (min-width:45em) {
.h4, h4 {font-size:3.2em}}
.h5, h5 {font-size:1.8em; line-height:1.3}
@media (min-width:45em) {
.h5, h5 {font-size:2.4em; letter-spacing:-.01em}}
.h6, h6 {font-size:1.6em}
@media (min-width:45em) {
.h6, h6 {font-size:2em; letter-spacing:-.01em}}
.sub-h1, .sub-h2, .sub-h3, .sub-h4, .sub-h5, .sub-h6 { font-family: 'Noto Sans KR', sans-serif; padding:0 0 28px 0}
.sub-h1 {font-size:3.6em; line-height:1.2; }
@media (min-width:45em) {
.sub-h1 {font-size:4em}}
.sub-h2 {font-size:2.6em; line-height:1.2; font-weight:700}
@media (min-width:45em) {
.sub-h2 {font-size:4em}}
.sub-h3 {font-size:2.4em; line-height:1.2; font-weight:700}
@media (min-width:45em) {
.sub-h3 {font-size:3em}}
.sub-h4 {font-size:2.4em; line-height:1.2}
.sub-h5 {font-size:1.4em; letter-spacing:.02em; line-height:1.3}
@media (min-width:45em) {
.sub-h5 {font-size:1.8em}}
.sub-h6 {font-size:1.4em; line-height:1.3; letter-spacing:.02em}
.exp {font-weight:700}
@media (min-width:45em) {
.page-title {margin:4.70085% 0}}
.wipe {position:relative; overflow:hidden}
.wipe-img {overflow:hidden; position:relative}
.wipe img {width:100%}
.wipe-rect {position:absolute; top:0; left:0; right:0; bottom:0}
.list-select-selector, .selectbox-selector, [type=email], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=url], select, textarea {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
padding:9px 14px;
color:#454545;
font-size:16px;
line-height:20px;
border:1px solid #ccc;
background:#fff;
vertical-align:middle;
-webkit-appearance:none;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
-webkit-transition:border-color .3s;
-moz-transition:border-color .3s;
-o-transition:border-color .3s;
transition:border-color .3s}


.cover {height:100vh; position:relative; text-align:center}
.cover--full {}
.cover.is-floating {height:80vh}
.cover-bg {overflow:hidden; position:absolute; top:0; left:0; right:0; bottom:0}
.cover-bg .visual {height:100%; background-position:50% 50%; background-size:cover}
.cover-bg .visual-space {position:absolute}
.cover-bg .visual-space iframe, .cover-bg .visual-space video {width:100%}
.cover-continue {position:absolute; right:0; bottom:0; left:0;  font-size:1.4em; text-align:center; line-height:1; text-transform:uppercase; letter-spacing:0; color:#fff; z-index:3}
.cover-continue:after {content:''; display:block; width:1px; height:30px; margin:10px auto 0; background-color:#222}
.cover-continue--white {color:#fff}
.cover-continue--white:after {background-color:#fff}
@media (min-width:45em) {
.cover { }
.cover.is-floating {}}
@media (min-width:60em) {
.cover, .cover--full {}
.cover.is-floating {height:80vh}
.cover-continue {letter-spacing:.2em}
.cover-continue:after {height:50px}}
.content-header {text-align:center}
.content-header .visual {position:relative; display:block; height:190px; background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
.content-header .visual:before {content:''; position:absolute; left:50%; bottom:-25px; width:1px; height:50px; background-color:#666}
.content-header .heading {padding-top:2em; color:#fff}
.content-header .heading img {padding-top:4em}
.content-header .copy {padding:2em 0 0; color:#fff; font-size:1.6em}
.content-header .heading+.copy {padding-top:1em}
@media (max-width:44.99em) {
.content-header .heading img {max-width:200px}}
@media (min-width:60em) {
.content-header .heading {padding-top:2.5em}
.content-header .heading img {padding-top:2.5em}
.content-header .visual {position:relative; display:block; height:320px}
.content-header .visual:before {bottom:-30px; height:60px}
.content-header .copy {padding-top:2.5em; font-size:2em}
.content-header .copy span {display:block}
.content-header .copy br {display:none}}



.story-header .cont {margin:0 auto; width:90%; height:100%; text-align:center; overflow:hidden; word-break:keep-all; word-wrap:break-word; white-space:nowrap}
.story-header .cont-cell {display:inline-block; vertical-align:middle; white-space:normal}
.story-header .cont:after {content:""; display:inline-block; height:100%; vertical-align:middle}
.story-header .cont-cell {position:relative; z-index:10}
.story-header .logo {margin-bottom:0; line-height:1.5; font-size:4em; color:#fff}
.story-header .logo:before {display:inline-block;  text-transform:none; color:#fff; font-size:32px; line-height:1; vertical-align:top}  /*content:""; */
.story-header .subheading {margin:0 auto; margin-bottom:1em; font-size:1.4em; line-height:1.4; color:#fff;  }
.story-header .subheading span {display:inline;}
.story-section {padding:40px 0}
@media (min-width:45em) {
.story-section {padding:80px 0 120px 0}
.story-header .logo {font-size:5em}
.story-header .logo:before {font-size:41px;}
.story-header .subheading {margin-bottom:0; font-size:1.6em; line-height:1.8;}
.story-header .subheading span {display:block;}
}

.story-section--philosophy .story-title { text-align:center; letter-spacing:-1px;   }
.story-section--philosophy .story-title h1.h4{color:#454545;font-family: 'Noto Sans KR' , sans-serif; word-break:keep-all}
.story-section--philosophy .item {text-align:center}
.story-section--philosophy .item .heading {position:relative}
.story-section--philosophy .item .heading:before {/*position:absolute; top:-50px; left:50%; width:1px; height:40px; content:''; background-color:#333*/}
.story-section--philosophy .item .cont {margin-top:30px; padding-left:4%; margin-bottom:30px; word-break:keep-all; word-wrap:break-word}
.story-section--philosophy .item.item--science .cont {padding-left:inherit;}
.story-section--philosophy .item .cont p+p {margin-top:30px}
.story-section--philosophy .item .p {font-size:1.6em}
@media (min-width:45em) {
.story-section--philosophy .item {margin-bottom:100px; text-align:left; display:-ms-flexbox; display:-webkit-flex; display:flex; -ms-flex-align:center; -webkit-align-items:center; -webkit-box-align:center; align-items:center}
.no-flexbox .story-section--philosophy .item .cont {margin-top:100px}
.story-section--philosophy .item .cont br {display:none}
.story-section--philosophy .item .p {font-size:1.8em}
.story-section--philosophy .item:last-child {margin-bottom:0}
.story-section--philosophy .item--plant .heading:before {top:75%; left:-80px; width:70px; height:1px}
.story-section--philosophy .item--science {flex-direction:row-reverse}
.story-section--philosophy .item--science .heading:before {top:75%; left:auto; right:-13.5%; width:70px; height:1px}
.no-flexbox .story-section--philosophy .item--science {position:relative}
.no-flexbox .story-section--philosophy .item--science .cont {position:absolute; left:0; top:0}
.no-flexbox .story-section--philosophy .item--science .img {margin-left:33.33333%}
.story-section--philosophy .item--life .heading:before {top:75%; left:-80px; width:70px; height:1px}

}
@media (min-width:60em) {
.story-section--philosophy .item .p {font-size:2em}
.story-section--philosophy .item--science .cont {margin-right:-7.3%}
.story-section--philosophy .item--science .heading:before {right:4.5%;}
}
@media (min-width:80em) {
.story-section--philosophy .item .cont span {display:block}
}

@keyframes Background {
0% {
opacity:.5;
-webkit-transform:scale(1);
-moz-transform:scale(1);
-ms-transform:scale(1);
-o-transform:scale(1);
transform:scale(1)}
100% {
opacity:0;
-webkit-transform:scale(1.2);
-moz-transform:scale(1.2);
-ms-transform:scale(1.2);
-o-transform:scale(1.2);
transform:scale(1.2)}}
@keyframes Twinkle_1 {
0% {
opacity:0;
-webkit-transform:scale(.25);
-moz-transform:scale(.25);
-ms-transform:scale(.25);
-o-transform:scale(.25);
transform:scale(.25)}
25% {
opacity:1;
-webkit-transform:scale(.5);
-moz-transform:scale(.5);
-ms-transform:scale(.5);
-o-transform:scale(.5);
transform:scale(.5)}
100% {
opacity:0;
-webkit-transform:scale(.25);
-moz-transform:scale(.25);
-ms-transform:scale(.25);
-o-transform:scale(.25);
transform:scale(.25)}}
@keyframes Twinkle_2 {
0% {
opacity:0;
-webkit-transform:scale(.5);
-moz-transform:scale(.5);
-ms-transform:scale(.5);
-o-transform:scale(.5);
transform:scale(.5)}
17% {
opacity:0;
-webkit-transform:scale(.5);
-moz-transform:scale(.5);
-ms-transform:scale(.5);
-o-transform:scale(.5);
transform:scale(.5)}
30% {
opacity:1;
-webkit-transform:scale(1);
-moz-transform:scale(1);
-ms-transform:scale(1);
-o-transform:scale(1);
transform:scale(1)}
100% {
opacity:0;
-webkit-transform:scale(.5);
-moz-transform:scale(.5);
-ms-transform:scale(.5);
-o-transform:scale(.5);
transform:scale(.5)}}
@keyframes Bokeh_1 {
0% {
opacity:.5}
22% {
opacity:.6}
45% {
opacity:.4}
100% {
opacity:.5}}
@keyframes Bokeh_2 {
0% {
opacity:.3}
15% {
opacity:.25}
30% {
opacity:.2}
45% {
opacity:.25}
100% {
opacity:.3}}