@charset "utf-8";
/*------------------------------------------------------------
|  Author:Free-Template.co
|  Author URL:https://free-template.co/
|  License:https://creativecommons.org/licenses/by/3.0/
|  License URL:https://creativecommons.org/licenses/by/3.0/
-------------------------------------------------------------*/
/* Base */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Anton&display=swap');
@import url('../fonts/fontello/css/fontello.css');
@import url('../fonts/fontello/css/animation.css');
body{margin:0 auto;padding:0;overflow-x:hidden !important;background:#f8f8f8;line-height:1.4;color:#000;font-weight:500;font-family:'Noto Sans KR', sans-serif;font-size:1em;width:100%;color:#7367f0}
::-moz-selection{background:#000;color:#fff}
::selection{background:#000;color:#fff}
a{-webkit-transition:.3s all ease;-o-transition:.3s all ease;transition:.3s all ease;text-decoration:none}
a:hover{text-decoration:none}
ul, ol{list-style:none;margin:0;padding:0}
/*h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5{font-family:'Montserrat', sans-serif;word-break:keep-all !important}*/
h1.hidden{display:none}
input, textarea, select, button{font-family:'Noto Sans KR', sans-serif;font-weight:400}
input.ed, select.ed, textarea.ed{border:1px solid #ccc;border-radius:5px;background:#fff;padding:8px 15px;font-size:1.1em;line-height:1;width:100%;width:calc(100% - 30px);
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
outline: none;
}
textarea.ed{padding:15px;min-height:400px;line-height:1.4}
input.ed:focus, select.ed:focus, textarea.ed:focus{
-webkit-box-shadow:  0 0 5px #9ed4ff;
-moz-box-shadow:  0 0 5px #9ed4ff;
box-shadow: 0 0 5px #9ed4ff;
border:1px solid #558ab7 !important;
}
input.ed:disabled, select.ed:disabled, textarea.ed:disabled{background:#ddd}
input:-moz-placeholder{font-size:.8em;font-weight:400;color:#aaa}
input::-moz-placeholder{font-size:.8em;font-weight:400;color:#aaa}
input:-ms-input-placeholder{font-size:.8em;font-weight:400;color:#aaa}
input::-webkit-input-placeholder{font-size:.8em;font-weight:400;color:#aaa}
img{vertical-align:top;max-width:100%}
button{cursor:pointer}
input:focus, input:active, button:focus, button:active{outline:none}
.clear{clear:both}
.siteWrap{position:relative;margin:0 auto;width:100%;overflow-x:hidden !important}
.siteWrap:before{-webkit-transition:.3s all ease-in-out;-o-transition:.3s all ease-in-out;transition:.3s all ease-in-out;background:rgba(0, 0, 0, 0.6);content:"";position:fixed;z-index:2000;top:0;left:0;right:0;bottom:0;opacity:0;visibility:hidden}
.container{margin:0 auto;padding:0 0 50px 0;width:100%;max-width:100%}
.container>section{margin:0 auto;text-align:center}
.site-wrap{width:100% !important;overflow-x:hidden !important;}
.site-wrap:before{-webkit-transition:.3s all ease-in-out;-o-transition:.3s all ease-in-out;transition:.3s all ease-in-out;background:rgba(0, 0, 0, 0.6);content:"";position:fixed;z-index:2000;top:0;left:0;right:0;bottom:0;opacity:0;visibility:hidden}
.siteWrap .site-section{margin:0 auto;width:100%}
.imgWrap .mobile{display:none}

header{position:fixed;margin:0 auto;z-index:1999;width:100%}
header.on{background:#fff;-webkit-box-shadow:-10px 0 20px -10px rgba(0, 0, 0, 0.2);-ms-box-shadow:-10px 0 20px -10px rgba(0, 0, 0, 0.2);box-shadow:-10px 0 20px -10px rgba(0, 0, 0, 0.2)}
header>div{margin:0 auto;width:1000px}
header .site-logo{float:left;padding:24px 0 0 0}
header nav{float:right;margin-right:-25px}
header nav>ul>li{float:left;padding:0 25px}
header nav>ul>li>a{position:relative;display:inline-block;padding:35px 0;font-size:.86em;font-weight:400;color:#fff;letter-spacing:.05em}
header nav>ul>li>a:after{height:4px;border-radius:4px;background:#fff;content:"";position:absolute;top:0;left:0;right:0;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transition:.3s all ease;-o-transition:.3s all ease;transition:.3s all ease;}
header nav>ul>li>a:hover:after, header nav>ul>li>a.active:after{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}
header.on nav>ul>li>a{color:#3b86c5}
header.on nav>ul>li>a:after{background:#3b86c5}

header .site-menu-toggle{display:none;position:absolute;color:#000;top:10px;right:20px}
header .site-menu-toggle i{font-size:2.6em;color:#fff;line-height:1}
header.on .site-menu-toggle i{color:#333}
.site-mobile-menu{overflow-y:auto;width:300px;position:fixed;top:0;right:0;z-index:2000;background:rgba(0,0,0,.7);height:calc(100vh);-webkit-transform:translateX(110%);-ms-transform:translateX(110%);transform:translateX(110%);-webkit-box-shadow:-10px 0 20px -10px rgba(0,0,0,.1);box-shadow:-10px 0 20px -10px rgba(0,0,0,.1);-webkit-transition:.3s all ease-in-out;-o-transition:.3s all ease-in-out;transition:.3s all ease-in-out}
.site-mobile-menu-body .site-nav-wrap>li{display:block;margin:0 30px;padding:10px 0}
.site-mobile-menu-body .site-nav-wrap>li>a{position:relative;font-size:1.4em;color:#fff;min-width:60%}
.site-mobile-menu-body .site-nav-wrap >li>a:after{height:2px;background:#00a199;content:"";position:absolute;bottom:-2px;left:0;right:0;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transition:.3s all ease;-o-transition:.3s all ease;transition:.3s all ease}
.site-mobile-menu-body .site-nav-wrap>li>a:hover, .site-mobile-menu-body .site-nav-wrap>li>a.active{color:#00a199;position:relative}
.site-mobile-menu-body .site-nav-wrap>li>a:hover:after, .site-mobile-menu-body .site-nav-wrap>li>a.active:after{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}
.site-mobile-menu-close{font-size:2.6em;text-align:right;padding:10px 20px 0 0;color:#fff}
.site-mobile-menu-close>a{color:#fff}
.site-mobile-menu-close .icon-close2:before{font-weight:normal}
.offcanvas-menu .site-wrap{height:100%;width:100%;z-index:2;overflow:hidden}
.offcanvas-menu .site-wrap:before{opacity:1;visibility:visible}
.offcanvas-menu .site-mobile-menu{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}

section{margin:0 auto;word-break:keep-all}
/* section>div{margin:0 auto;width:1000px;max-width:90%} */
/* section#home{position:relative;background-image: linear-gradient( rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ),url('../images/bg01.jpg');padding:0 0 145px 0;color:#fff} */
/* section#home{position:relative;background:url('../images/bg01.jpg') 50% 50% no-repeat;padding:0 0 145px 0;color:#fff} */
section#home{position:relative;background:url('../images/bg01.jpg') 50% 50% no-repeat;padding:0 0 145px 0;color:#fff}
section#home .txt01{margin:0 auto;padding-top:220px;width:80%;text-align:center;font-size:1.22em;font-weight:300}
section#home .txt01>h2{margin:0;font-family:'Impact', 'Anton';font-size:5em;font-weight:300}
section#home ul.menu{height:42vh;padding-bottom: 20px; margin-top: -20px;}
section#home ul.menu:after{content:'';clear:both;display:block;visibility:hidden}
section#home ul.menu>li{float:left;width:50%;margin:0 auto;text-align:center;}
section#home ul.menu>li>a{display:inline-block;margin:70px auto 90px auto}
section#home ul.menu>li.ict{position: relative;}
section#home ul.menu>li.bio{position:relative;}
/* ict 태그 */
section#home ul.menu>li.bio>a>div.bio_img{border-radius: 50%;background-size:cover;background-position:center; width:200px;height: 200px; border: solid 2px white;background-image: linear-gradient(rgba(0,0,0,1),rgba(0,0,0,0)), url(../images/bioMenu2.png);}
section#home ul.menu>li.ict>a>div.ict_img{border-radius: 50%;background-size:cover;background-position:center; width:200px;height: 200px; border: solid 2px white;background-image: linear-gradient(rgba(0,0,0,1),rgba(0,0,0,0)), url(../images/ictMenu2.png);} 
section#home ul.menu>li.bio>a>div.menu_text{position:absolute;left:39%;top: 18%;;opacity: 0.8; color:white;
}
section#home ul.menu>li.bio>a>div.menu_text>p:first-child{font-size: 40px;font-weight: bold; margin-bottom: -30px;}
section#home ul.menu>li.bio>a>div.menu_text>p:nth-child(2){font-size: 25px; font-weight: 380;margin-bottom: 10px;}
section#home ul.menu>li.bio>a>div.menu_text>p:nth-child(3){font-size: 20px; font-weight: 380;}
section#home ul.menu>li.ict>a>div.menu_text{color:white;opacity:0.8;position:absolute;left:38%;top:18%; 
}
section#home ul.menu>li.ict>a>div.menu_text>p:first-child{font-size: 40px;font-weight: bold; margin-bottom: -30px;}
section#home ul.menu>li.ict>a>div.menu_text>p:nth-child(2){font-size: 25px; font-weight: 380;margin-bottom: 10px;}
section#home ul.menu>li.ict>a>div.menu_text>p:nth-child(3){font-size: 20px; font-weight: 380;}
section#home>.bottom{position:absolute;bottom:0;width:100%;max-width:100%;margin:0 auto;padding:50px 0;background:rgba(0,0,0,.4);border-top:1px solid #fff}
section#home>.bottom>ul{margin:0 auto;width:1000px;max-width:94%}
section#home>.bottom>ul:after{content:'';clear:both;display:block;visibility:hidden}
section#home>.bottom>ul>li{float:left;width:50%;margin:0 auto;text-align:center}
section#home>.bottom>ul>li>a{display:inline-block;padding:0 0 0 60px;text-align:left;color:#fff}
section#home>.bottom>ul>li>a.home{background:url('../images/icon01.png') 0 50% no-repeat}
section#home>.bottom>ul>li>a.farm{background:url('../images/icon02.png') 0 50% no-repeat}

section#company{position:relative;background:url('../images/bg02.jpg') 50% 100% no-repeat;padding:89px 0 240px 0;color:#fff}
section#company h2{margin:0;padding:120px 0 0 0;text-align:center;font-family:'Impact', 'Anton';font-size:3.8em;font-weight:300}
section#company ul{padding:180px 0 0 0}
section#company ul:after{content:'';clear:both;display:block;visibility:hidden}
section#company ul>li{float:left;width:50%;margin:0 auto;text-align:center}
section#company ul>li>div{display:inline-block;text-align:left}
section#company ul>li>div.mission{margin-right:70px}
section#company ul>li>div.vision{margin-left:90px}
section#company ul>li>div>h3{margin:0;display:inline-block;border:1px solid #fff;border-radius:50px;padding:15px 40px;font-size:2em}
section#company ul>li>div>div{width:260px;max-width:100%;font-size:1.2em;font-weight:300;padding:20px 0 0 10px}

section#history>div{padding:90px 0;text-align:center}
section#history h2{margin:0 0 70px 0;text-align:center;font-family:'Impact', 'Anton';font-size:3.8em;font-weight:300;color:#3d94ba}
section#history div .history02{width:80%;}
section#bio{position:relative;background:#fff url('../images/bg03.jpg') 50% 0 no-repeat;padding:89px 0}
section#bio .business{padding:80px 0;color:#fff}
section#bio .business h2{margin:0;text-align:center;font-family:'Impact', 'Anton';font-size:3.8em;font-weight:300;line-height:1.37em}
section#bio .business ul{padding:60px 0 0 0}
section#bio .business ul:after{content:'';clear:both;display:block;visibility:hidden}
section#bio .business ul>li{float:left;margin:0 auto}
section#bio .business ul>li:nth-child(1){width:40%}
section#bio .business ul>li:nth-child(2){width:40%}
section#bio .business ul>li:nth-child(3){width:20%}
section#bio .business ul>li:nth-child(1)>div, section#bio .business ul>li:nth-child(2)>div{padding-right:80px}
section#bio .business ul>li>h3{margin:10px 0;font-size:1.5em;font-weight:400}
section#bio .business ul>li>div{font-size:1.15em;font-weight:300}
section#bio .environment>h3, section#bio .gene>h3, section#bio .ibt>h3{margin-top:100px;text-align:center;font-size:1.65em;font-weight:500;color:#1c7094}
section#bio .environment{text-align:center}
section#bio .environment>ul{margin:40px 20px 0 20px}
section#bio .environment ul>li{margin:20px auto 0 auto;padding:24px 0;background:#fff;border:1px solid #3b93c5;border-radius:50px;font-size:1.3em;font-weight:400;color:#3b93c5}
section#bio .gene{color:#333}
section#bio .gene>div{padding:50px 0 10px 0;text-align:center}
section#bio .gene>div>strong{font-size:1.7em;font-weight:500;color:#1c6394}
section#bio .gene>ul{margin:18px 20px;border:1px solid #3b93c5;border-radius:50px}
section#bio .gene>ul:after{content:'';clear:both;display:block;visibility:hidden}
section#bio .gene>ul>li{float:left;width:45%;font-size:1.2em;font-weight:400}
section#bio .gene>ul>li:first-child{width:55%;background:#3b93c5;padding:26px 0;border-radius:50px 0 0 50px;text-align:center;color:#fff}
section#bio .gene>ul>li.line01>span{display:inline-block;padding:26px 0 0 40px}
section#bio .gene>ul>li.line02>span{display:inline-block;padding:13px 0 0 40px}
section#bio .gene>ol{list-style:decimal;margin:0 auto;padding-top:30px;width:64%}
section#bio .gene>ol>li{font-size:1.22em;font-weight:400;line-height:1.6}
section#bio .ibt{text-align:center}
section#bio .ibt>ul{display:inline-block;margin-top:40px}
section#bio .ibt>ul:after{content:'';clear:both;display:block;visibility:hidden}
section#bio .ibt>ul>li{float:left;margin:0 20px;width:230px;font-size:1.2em;font-weight:400}
section#bio .ibt>ul>li>div{margin:0 auto 40px auto;background:#3ba9c5;width:180px;padding:48px 0;border-radius:50%}
section#bio .ibt>ul>li>strong{display:block;text-align:left;font-size:1.25em;font-weight:500;color:#3ba9c5}
section#bio .ibt>ul>li:nth-child(2)>div{background:#129e9c}
section#bio .ibt>ul>li:nth-child(2)>strong{color:#129e9c}
section#bio .ibt>ul>li:nth-child(3)>div{background:#28af7b}
section#bio .ibt>ul>li:nth-child(3)>strong{color:#28af7b}
section#bio .ibt>ul>li>p{text-align:left;color:#333}

section#ict{position:relative;background:#fff url('../images/bg04.jpg') 50% 0 no-repeat;padding:89px 0 100px 0}
section#ict .business{padding:80px 0 150px;color:#fff}
section#ict .business h2{margin:0;text-align:center;font-family:'Impact', 'Anton';font-size:3.8em;font-weight:300;line-height:1.37em}
section#ict .business ul{padding:80px 0 0 0;margin:0 auto;width:92%}
section#ict .business ul:after{content:'';clear:both;display:block;visibility:hidden}
section#ict .business ul>li{float:left;margin:0 auto}
section#ict .business ul>li:nth-child(1){width:35%}
section#ict .business ul>li:nth-child(2){width:35%}
section#ict .business ul>li:nth-child(3){width:30%}
section#ict .business ul>li>div{padding-top:10px;line-height:1.5}
section#ict .business ul>li:nth-child(1)>div, section#bio .business ul>li:nth-child(2)>div{padding-right:60px}
section#ict .business ul>li>div{font-size:1.3em;font-weight:300}
section#ict .ictBox{padding:80px 0;color:#fff}
section#ict .ictBox>.rows{margin:0 -10px}
section#ict .ictBox>.rows>ul:after{content:'';clear:both;display:block;visibility:hidden}
section#ict .ictBox>.rows>ul>li{float:left;padding:0 9px}
section#ict .ictBox>.rows>ul>li>div{width:321px;height:429px}
section#ict .ictBox>.rows>ul>li:nth-child(1)>div{background:url('../images/ictBox01.png') 0 0 no-repeat}
section#ict .ictBox>.rows>ul>li:nth-child(2)>div{background:url('../images/ictBox02.png') 0 0 no-repeat}
section#ict .ictBox>.rows>ul>li:nth-child(3)>div{background:url('../images/ictBox03.png') 0 0 no-repeat}
section#ict .ictBox>.rows>ul>li>div>h3{margin:0;padding:60px 0 0 30px;font-size:1.6em;font-weight:400}
section#ict .ictBox>.rows>ul>li>div>div{padding:20px 30px 0 30px;font-size:1.2em;font-weight:300}
section#ict .ictBox>.rows>ul>li>div>div>ul>li{position:relative;padding-left:15px}
section#ict .ictBox>.rows>ul>li>div>div>ul>li:before{content:'-';position:absolute;left:0}
section#ict>div.technology{width:100%;max-width:100%;background:#f2f2f2;padding:80px 0 100px 0}
section#ict>div.technology>div{margin:0 auto;width:1000px;max-width:94%;text-align:center}
section#ict>div.technology>div>strong{font-size:1.7em;font-weight:500;color:#1c6394}
section#ict>div.technology>div>.txt01{padding:40px 0;font-size:1.22em;font-weight:400;color:#333}
section#ict>div.patent{padding:80px 0 0 0;text-align:center}
section#ict>div.patent>strong{display:block;font-size:1.7em;font-weight:500;color:#1c6394}
section#ict>div.patent>ul{display:inline-block;margin-top:30px}
section#ict>div.patent>ul:after{content:'';clear:both;display:block;visibility:hidden}
section#ict>div.patent>ul>li{float:left;padding:0 12px}

section#contact{position:relative;background:#fff url('../images/bg05.jpg') 50% 0 no-repeat;padding:89px 0 0 0}
section#contact .contact{padding:80px 0 106px 0;color:#fff}
section#contact .contact h2{margin:0;text-align:center;font-family:'Impact', 'Anton';font-size:3.8em;font-weight:300;line-height:1.37em}
section#contact .contact .info{padding-top:70px}
section#contact .contact .info>div{margin:0 auto;width:70%;font-size:1.15em;font-weight:300;line-height:2.6em}
section#contact .contact .info>div:after{content:'';clear:both;display:block;visibility:hidden}
section#contact .contact .info strong{float:left;display:inline-block;padding-right:20px;font-size:1.25em;font-weight:400}
section#contact .contact .info span{float:left;display:inline-block;padding-right:40px}
section#contact .contact .info span>a{color:#fff}
section#contact .mapWrap{margin:0 auto;padding:80px 0;width:100%;max-width:100%}
section#contact .mapWrap>#map{margin:0 auto;width:1000px;max-width:100%;height:500px;border-radius:40px}
section#contact .mapWrap>.sns{margin-top:40px;text-align:center}
section#contact .mapWrap>.sns button{margin:0 8px;border:0;width:50px;height:49px}
section#contact .mapWrap>.sns button.talk{background:transparent url('../images/btnTalk.png') 50% 0 no-repeat}
section#contact .mapWrap>.sns button.weChat{background:transparent url('../images/btnWeChat.png') 50% 0 no-repeat}
section#contact .mapWrap>.sns button.mail{background:transparent url('../images/btnMail.png') 50% 0 no-repeat}

table.table01{clear:both;background:#4d5666;margin:0;padding:0;width:100%;font-size:1em}
table.table01 th{background:#dfdfdf;border:1px solid #e6e6e6;color:#000;padding:5px 0;text-align:center;font-weight:800;font-size:1em}
table.table01 td{background:#FFFFFF;text-align:center;border:1px solid #DFDFDF;padding:5px 0;font-size:.95em;font-weight:400}
table.table01 td.num{padding:5px 5px 5px 0;font-size:.7em;color:#555;text-align:right}
table.table01 button.closeMore{background:transparent;border:0;color:#000;line-height:1}

footer{background:#444;padding:50px 0;text-align:center;color:#fff}
footer>div{display:inline-block}
footer>div:after{content:'';clear:both;display:block;visibility:hidden}
footer>div>dl{float:left;margin:0 0 0 70px}
footer>div>dl:first-child{margin:0}
footer>div>dl:after{content:'';clear:both;display:block;visibility:hidden}
footer>div>dl>dt{float:left;font-size:1.2em;font-weight:400}
footer>div>dl>dd{float:left;position:relative;margin:0;padding-left:30px;font-weight:100;line-height:1.6}
footer>div>dl>dd:before{content:'|';position:absolute;top:3px;left:14px;font-size:.8em}
footer>div.copy{display:block;margin-top:20px;font-weight:300}

/*PRELOADING------------ */
#overlayer{display:none;width:100%;height:100%;position:fixed;z-index:3000;background:rgba(0,0,0,.7);top:0;left:0;right:0;bottom:0}
.loader{display:none;z-index:3100;position:fixed;top:50%;left:50%;font-size:2em;color:#fff}

/* .snowflow {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: white;
    position: absolute;
    top: -25px;
  }
  
  @keyframes snowflow {
    from {
    }
    to {
      transform: translateY(100vh);
      opacity: 0;
    }
  } */

/* Company History */
.hisWrap .dash { text-align:center;}
.hisWrap .dash > span { display:block; margin:0 auto; border-left:3px solid #88c9df; width:3px; }
.hisWrap .cateli { position:relative; }
.hisWrap .cateli .hiscontents { position:absolute; top:0; width:calc(50% - 80px);}
.hisWrap .cateli0 .hiscontents { left:-8px; text-align:right; padding-right:0.5em;}
.hisWrap .cateli1 .hiscontents { left:calc(50% + 80px); text-align:left; padding-left:0.5em;}
.hisWrap .cateli .hiscontents .solid { background:#88c9df; width:31px; height:3px; display:inline-block;
	position:absolute; top:49px;}
.hisWrap .cateli .hiscontents dl { padding:0; margin:0;  }
.hisWrap .cateli0 .hiscontents .solid { right:-31px;}
.hisWrap .cateli1 .hiscontents .solid { left:-34px;}
.hisWrap .cateli .hiscontents .historycon { display:inline-block; width: calc(100% - 10px); padding:2px 0; }
.hisWrap .cateli .hiscontents .historydash { display:inline-block; width:10px; height:20px; padding:2px 0; 
	overflow:hidden; color:#f7040482; font-weight:900 }
.hisWrap .cateli0 .hiscontents .historycon { float:left }
.hisWrap .cateli0 .hiscontents .historydash { float:left }
.hisWrap .cateli1 .hiscontents .historycon { float:right }
.hisWrap .cateli1 .hiscontents .historydash { float:right }
.hisWrap .cateli0 .hiscontents .subdash { margin-right:10px; }
.hisWrap .cateli1 .hiscontents .subdash { margin-left:10px; }


.hisWrap .cateli .circlebox { width:100px; height:100px; position:relative; left: calc(50% - 51px); }
.hisWrap .cateli .circle { display:block; width:49px; height:94px; border:3px solid #88c9df; }
.hisWrap .cateli0 .circle { 
   border-radius: 50px 0 0 50px;
   border-right:none;
   position:absolute;
   left:-1px;
}
.hisWrap .cateli1 .circle { 
   border-radius: 0 50px 50px 0;
   border-left:none;
   position:absolute;
   right:0;
}
.hisWrap .cateli .incircle { font-size:1.6em;color:#fff; width:84px; height:84px; line-height:80px; 
	text-align:center; position:absolute; }
.hisWrap .cateli0 .incircle { display:block; background:#59b8a5; 
	top:8px; left:8px; 
	border-radius: 50%;
}
.hisWrap .cateli1 .incircle { display:block; background:#0c3678de; 
	top:8px; right:8px; 
	border-radius: 50%;
}

@media (max-width:768px){
    ul.mainBox>li{float:none;width:100%;float:none;max-width:651px}
    header .site-logo{padding:15px 0 16px 20px}
    header nav{display:none}
    header .site-menu-toggle{display:block}
    section#home{padding:0 0 140px 0}
    section#company ul{padding:150px 0 0 0}
    section#company ul>li>div.mission{margin-right:40px}
    section#company ul>li>div.vision{margin-left:50px}
    section#bio .business{padding:62px 0}
    section#bio .business ul{font-size:.9em}
    section#bio .environment>ul{margin:40px 0 0 0}
    section#bio .environment>ul>li{padding:20px}
    section#bio .gene{font-size:.9em}
    section#bio .gene>ul{margin:18px 0;font-size:.9em}
    section#bio .gene>ol{width:84%}
    section#bio .ibt>ul>li{width:180px;font-size:.95em}
    section#ict .business{padding:78px 0 130px}
    section#ict .business ul{width:100%;font-size:.9em}
    section#ict .ictBox>.rows{text-align:center}
    section#ict .ictBox>.rows>ul{display:inline-block}
    section#ict .ictBox>.rows>ul>li{clear:both;padding:0;margin-bottom:20px;text-align:left}
    section#ict .ictBox>.rows>ul>li:last-child{margin:0}
    section#ict>div.patent>ul{width:100%}
    section#ict>div.patent>ul>li{float:left;width:30%;padding:0 0 0 5%}
    section#ict>div.patent>ul>li:first-child{padding:0}
    section#contact .contact .info>div{width:100%}
    section#contact .mapWrap>#map{border-radius:0}
    footer{font-size:.9em}
    footer>div>dl{margin:0 0 0 40px}
    footer>div>dl>dd{padding-left:20px}
    footer>div>dl>dd:before{left:9px}
}
@media (max-width:600px){
    .imgWrap .web{display:none}
    .imgWrap .mobile{display:block}
    section#home .txt01{padding-top:200px;width:100%}
    section#home>.bottom>ul>li>a.home, section#home>.bottom>ul>li>a.farm{background-size:auto 100%;padding:0 0 0 50px}
    section#company{padding:89px 0 220px 0}
    section#home ul.menu>li.bio>a>div.menu_text{position:absolute;left:28%;top: 16%;;opacity: 0.8; color:white;
    }
    section#home ul.menu>li.ict>a>div.menu_text{position:absolute;left:28%;top: 16%;;opacity: 0.8; color:white;
    }
    section#home ul.menu>li.bio>a>div.bio_img{width:180px; height:180px;}
    section#home ul.menu>li.ict>a>div.ict_img{width:180px; height:180px;}
    section#home ul.menu{height:35vh;padding-bottom: 30px; margin-top: -40px;}

	/* Company History */
	.hisWrap .dash_under, .dashstart { display:none }
	.hisWrap .dash { text-align:left;}
	.hisWrap .dash > span { border-left:none; }

	.hisWrap .cateli .hiscontents { position:absolute; top:0; width:calc(100% - 150px);}

	.hisWrap .cateli0 .hiscontents .historycon { float:right }
	.hisWrap .cateli0 .hiscontents .historydash { float:right }
	.hisWrap .cateli0 .hiscontents .subdash { margin-left:10px; }

	.hisWrap .cateli0 .hiscontents, .hisWrap .cateli1 .hiscontents {
		left: 130px;
		text-align: left;
		padding-left: 0.5em;
	}

	.hisWrap .cateli .circlebox { width:100px; height:100px; position:relative; left:10px; }
	.hisWrap .cateli .circle { display:none; }
}

@media (max-width:425px){
    body{font-size:.8em}
    ul.mainBox{min-width:96%}
    ul.mainBox>li>div{margin:5px 12px}
    ul.mainBox>li button{font-size:.9em}
    ul.btnWrap>li{width:33.33333333%}
    ul.mainBox>li button{width:100%}
    table.table01{font-size:.8em}
    table.table01 th{word-break:keep-all}
    header .site-menu-toggle{top:18px}
    .site-mobile-menu-body .site-nav-wrap>li>a{font-size:1.8em}
    section#home .txt01{padding-top:150px;width:100%}
    section#home ul.menu>li>a{width:100%;width: 90%;}
    section#company{padding:89px 0 200px 0}
    section#company h2{margin:0;padding:80px 0 0 0}
    section#company ul{padding:100px 0 0 0;font-size:.85em}
    section#company ul>li>div.mission{margin:0 auto;width:94%;float:left}
    section#company ul>li>div.vision{margin:0 auto;width:94%;float:right}
    section#company ul>li>div>h3{display:block;border-radius:50px;padding:15px 0;text-align:center;font-size:2em;letter-spacing:-0.05em}
    section#company ul>li>div.mission>div,
    section#company ul>li>div.vision>div{padding:20px 0 0 0;font-size:1.5em}
    section#bio{background:#fff url('../images/bg03_m.jpg?v=2') 50% 0 no-repeat;padding:70px 0}
    section#bio .business{padding:45px 0}
    section#bio .business ul{padding:40px 0 0 0;font-size:1em}
    section#bio .business ul>li{clear:both;float:none;width:70% !important;margin:0 auto 30px auto}
    section#bio .business ul>li>div{padding:0 !important}
    section#bio .environment>h3, section#bio .gene>h3, section#bio .ibt>h3{margin-top:50px}
    section#bio .gene>ol{width:90%}
    section#bio .gene>ul>li{width:50%;font-size:1.3em}
    section#bio .gene>ul>li:first-child{width:50%}
    section#bio .gene>ul>li>span{padding:26px 10px 0 10px !important}
    section#bio .ibt>ul{margin:0}
    section#bio .ibt>ul>li{clear:both;float:none;margin-top:50px;width:200px;font-size:1.3em}
    section#bio .ibt>ul>li:first-child{margin-top:20px}
    section#bio .ibt>ul>li>div{margin:0 auto 20px auto}
    section#ict{background:#fff url('../images/bg04_m.jpg?v=4') 100% 0 no-repeat}
    section#ict .business{padding:50px 0 60px}
    section#ict .business ul{padding:50px 0 0 0}
    section#ict .business ul>li{clear:both;float:none;width:60% !important;margin:0 auto 30px auto}
    section#ict .ictBox>.rows>ul>li{font-size:1.4em}
    section#contact .contact{padding:50px 0;color:#fff}
    section#contact .contact .info{margin:0 auto;padding-top:50px;width:90%}
    section#contact .contact .info>div{line-height:1.8em;font-size:1.6em}
    section#contact .contact .info>div:first-child{margin-bottom:30px}
    section#contact .contact .info>div>div:after{content:'';clear:both;display:block;visibility:hidden}
    footer{font-size:1.1em}
    footer>div>dl{float:none;margin:0 0 10px 0 !important}
    section#home ul.menu{height:35vh;padding-bottom: 30px; margin-top: -40px;}
    section#home ul.menu>li.bio>a>div.menu_text{position:absolute;left:24%;top: 22%;;opacity: 0.8; color:white;
    }
    section#home ul.menu>li.ict>a>div.menu_text{position:absolute;left:20%;top: 22%;;opacity: 0.8; color:white;
    }
}
@media (max-width:424px){
    body{font-size:.7em}
    section#home>.bottom>ul>li>a.home, section#home>.bottom>ul>li>a.farm{padding:0 0 0 40px}
    section#home ul.menu>li.bio>a>div.bio_img{width:160px; height:160px;padding-bottom: 10px;}
    section#home ul.menu>li.ict>a>div.ict_img{width:160px; height:160px; padding-bottom: 10px;}
    section#home ul.menu>li.bio>a>div.menu_text>p:first-child{font-size: 25px;}
    section#home ul.menu>li.bio>a>div.menu_text>p:nth-child(2){font-size: 20px;}
    section#home ul.menu>li.ict>a>div.menu_text>p:first-child{font-size: 25px;}
    section#home ul.menu>li.ict>a>div.menu_text>p:nth-child(2){font-size: 20px;}
    section#home ul.menu>li.ict>a>div.menu_text{ left:28% }
}
@media (max-width:375px){
    body{font-size:.7em}
}
@media (max-width:320px){
    body{font-size:.6em}
    section#ict .ictBox>.rows>ul>li>div{width:280px;height:374px;background-size:100% !important}
}