@charset "utf-8";

/* NanumBarunGothic 기본 폰트 */
@import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css');
@import url('font.css');
@font-face{
font-family:'Nanum Gothic';
src:url('../fonts/NanumGothic.eot');
src:url('../fonts/NanumGothic.eot?#iefix') format('embedded-opentype'),
url('../fonts/NanumGothic.woff') format('woff'),
url('../fonts/NanumGothic.ttf') format('truetype');
url('../fonts/NanumGothic.svg#NanumGothic') format('svg')
src:local(※), url('../fonts/NanumGothic.woff') format('woff');

}
@import url('PIE.htc');
* { box-sizing:border-box;behavior:url('PIE.htc');}
html,body {height:100%;min-height:100%}
body {color:#444;background: white;font-family:'Nanum Gothic',sans-serif;font-weight:300;-webkit-font-smoothing: antialiased;padding:0;margin:0}
img {border:0}
a {color:$#666;text-decoration:none}
h1 {font-size:20px;line-height: 1.8;text-transform:uppercase;font-family:'Nanum Gothic',sans-serif;letter-spacing:-1px;}
strong {font-weight:800}


.row {
  width: 100%;
  min-height:100%;
  margin: 0 auto;
  position: relative;
  padding: 0 2%;
}

.content {
  max-width: 940px;
  width: 100%;
  min-height:100%;
 
  margin: 0 auto;
  padding: 50px 2% 50px 2%;
}

.main_header .row .content { padding: 0; }


.dark {background:#333;color:#fff}
.depthbg_one {color:#fff;background-image:url('../images/mainbg1.jpg');background-size:cover;background-position:50% 50%;background-attachment: fixed;}
.depthbg_two {color:#fff;background-image:url('../images/mainbg2.jpg');background-size:cover;background-attachment: fixed;}
.depthbg_three {color:#fff;background-image:url('../images/mainbg3.jpg');background-size:cover;background-position:50% 50%;background-attachment: fixed;}

.hero {
  overflow:hidden;
  position: relative;
  background: #07B704;
  /*background: url(http://fillmurray.com/1280/850) no-repeat center center fixed;*/
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  text-align: center;
  color: #fff;
  padding-top: 55px;
  min-height: 200px;
  letter-spacing: -1px;
  font-family:'Nanum Gothic',sans-serif;
}

.hero h1 {
  font-size: 20px;
  line-height: 1.3;
}

.hero h1 span {
  font-size: 25px;
  color: #ffffff;
  border-bottom: 2px solid #ffffff;
  padding-bottom: 12px;
  line-height: 3;
}

.main_header {
  position: fixed;
  top: 0px;
  max-height: 70px;
  z-index: 999;
  width: 100%;
  padding-top: 17px;
  background: none;
  overflow: hidden;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
  top: -100px;
  padding-bottom: 6px;

}
@media only screen and (max-width: 766px) {

.main_header { padding-top: 25px; }
}

.open-nav { max-height: 400px !important; }

.open-nav .mobile-toggle {
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
}

.sticky {
  background-color: #f8f8f8;
  opacity: 1;
  top: 0px;
  border-bottom: 1px solid silver;
}

.logo {
  width: 101px;
  font-size: 25px;
  color: #8f8f8f;
  text-transform: uppercase;
  float: left;
  display: block;
  margin-top: 0;
  line-height: 1;
  margin-bottom: 10px;
}

.logo img {width:150px}

@media only screen and (max-width: 766px) {

.logo { float: none; }

.sticky {
  background-color: #f8f8f8;}
}

nav {
  float: right;
  width: 60%;
}
@media only screen and (max-width: 766px) {

nav { width: 100%; }
}

nav ul {
  list-style: none;
  overflow: hidden;
  text-align: right;
  float: right;
}
@media only screen and (max-width: 766px) {

nav ul {
  padding-top: 10px;
  margin-bottom: 22px;
  float: left;
  text-align: center;
  width: 100%;
}
}

nav ul li {
  display: inline-block;
  margin-left: 35px;
  line-height: 1.5;
}
@media only screen and (max-width: 766px) {

nav ul li {
  width: 100%;
  padding: 7px 0;
  margin: 0;
}
}

nav ul a {
  color: #888888;
  text-transform: uppercase;
  font-size: 0.926em;
}

.mobile-toggle {
  display: none;
  cursor: pointer;
  font-size: 20px;
  position: absolute;
  right: 22px;
  top: 0;
  width: 30px;
  -webkit-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}
@media only screen and (max-width: 766px) {

.mobile-toggle { display: block; }
}

.mobile-toggle span {
  width: 30px;
  height: 4px;
  margin-bottom: 6px;
  border-radius: 1000px;
  background: #8f8f8f;
  display: block;
}

.mouse {
  display: block;
  margin: 0 auto;
  width: 26px;
  height: 46px;
  border-radius: 13px;
  border: 2px solid #ffffff;
  position: absolute;
  bottom: 40px;
  position: absolute;
  left: 51%;
  margin-left: -26px;
}

.mouse span {
  display: block;
  margin: 6px auto;
  width: 2px;
  height: 2px;
  border-radius: 4px;
  background: #ffffff;
  border: 1px solid transparent;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: scroll;
  animation-name: scroll;
}
 @-webkit-keyframes 
scroll {  0% {
 opacity: 1;
 -webkit-transform: translateY(0);
 transform: translateY(0);
}
 100% {
 opacity: 0;
 -webkit-transform: translateY(20px);
 transform: translateY(20px);
}
}
@keyframes 
scroll {  0% {
 opacity: 1;
 -webkit-transform: translateY(0);
 -ms-transform: translateY(0);
 transform: translateY(0);
}
 100% {
 opacity: 0;
 -webkit-transform: translateY(20px);
 -ms-transform: translateY(20px);
 transform: translateY(20px);
}
}

.sec01, .sec02, .sec03, .sec04 {line-height:1.400em;font-size:1.125em;font-weight:normal;text-align:center;letter-spacing:-1px;padding-top:50px}
.visionbox {margin-top:25px;text-align:center}
.selected {color:#f15a22;}
.subTitle {font-size:23px;font-weight:bold;color:#ff603c;letter-spacing:-1px}
.visiontxt {display:block;margin-top:5px;font-size:16px;letter-spacing:-1px;color:#bbb;text-align:center}
.visionBox {margin:0;padding:0}
.visionBox li {width:100%;padding:10px;border-radius:4px;border:1px #666 solid;font-size:16px;color:#999;line-height:1.288em;list-style:none;margin-bottom:10px}

.compnay_infot {width:100%;border-collapse:collapse;border-top:2px #ff4800 solid;font-size:0.750em}
.compnay_infot caption {font-weight:800;margin:10px 0;text-align:left}
.compnay_infot th {width:20%;height:23px;padding:8px 0 8px 8px;border-bottom:1px #666 solid;letter-spacing:-1px;font-weight:bold;text-align:left;box-sizing:border-box}
.compnay_infot td{width:80%;height:23px;padding:8px 10px 8px 4px;border-bottom:1px #666 solid;box-sizing:border-box}

.igrifo_down {width:100%;margin-top:10px}
.igrifo_ttitle {font-size:0.813em;font-weight:800;margin:25px 0 10px 0;text-align:left}
.igrifo_down a {float:left;display:block;padding:10px 0;text-align:center;box-sizing:border-box;font-size:12px;color:#fff}
.igrifo_down a:hover {background:#ff4800}
.igrifo_down img {width:10px;vertical-align:middle}
.igrifo_down a:nth-child(1) {width:34%;border:1px #666 solid;border-right:none}
.igrifo_down a:nth-child(2) {width:33%;border:1px #666 solid;border-right:none}
.igrifo_down a:nth-child(3) {width:33%;border:1px #666 solid}

.visionchart {overflow:hidden;width:100%;font-size:0.875em;}
.visionchart p {border:1px #777 solid;background:url('../images/visionchartb.png');border-top:2px #ff4800 solid;min-height:85px;padding:5px;letter-spacing:-1px;font-size:0.875em;line-height:18px;text-align:center;box-sizing:border-box;}
.visionchart p:nth-child(1) {float:left;width:31%;margin-right:2%;}
.visionchart p:nth-child(2) {float:left;width:31%;margin-right:2%;}
.visionchart p:nth-child(3) {float:left;width:34%}




.container {
  margin: 0 auto;
  padding: 0; 
  color:#fff;
  width: 100%;
  box-sizing:border-box;
  font-size:0.875em;
  
}

.intro {
  font-size: 16px;
}
.js .panel-title {
  margin: 0;
}
.panel-title a {
  border-bottom: none;
  color:#fff;
  display: block;
  padding: 1.05em 0;
  position: relative;
  text-decoration: none;
  -webkit-transition: color 200ms ease 0s;
  -moz-transition: color 200ms ease 0s;
  transition: color 200ms ease 0s;
  width: 100%;
  font-size:0.875em;
}

.panel-title a .icon {
  color: #fff;
  position: absolute;
  right: 0;
  -webkit-transition: all 200ms ease 0s;
  -moz-transition: all 200ms ease 0s;
  transition: all 200ms ease 0s;
}
.panel-title a:hover,
.panel-title a:focus {
  color: #fff;
}
.panel-title a:hover .icon,
.panel-title a:focus .icon {
  color: #fff;
}
.panel-title a.active {
  color: #ff5400;
}
.panel-title a.active .icon {
  color: #ff4800;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}
.js .accordion {
  border-bottom: 1px solid #666;
  margin: 2em 0;
}
.accordion .panel-title a {
  border-top: 1px solid #666;
  font-size:0.875em;
}
[id^="panel-"] {
  padding-bottom: 1em;
}

.panel-content p {letter-spacing:-0.5px;font-size:13px;text-align:justify}
.playmarket {display:block;width:100px;height:25px;padding:5px;font-size:0;background-repeat:no-repeat;background-size:100px auto;background-image:url('../images/icon_googlestore.png')}



	.img-responsive{
		width:99%;
		padding:0;
		overflow:hidden;
	}
	.col-md-8 {
	float:left;
	width:35%;
	}
	.col-md-4 {
	float:left;
	width:35%;
	font-size:13px;
	line-height:23px;
	margin-top:60px;
	}

	@media (max-width: 480px) {
	.col-md-8, .col-md-4 {
		float:left;
		width:100%;
		font-size:16px;
		margin-top:0;
		}

	}
	
	img {
			position: relative;
			margin: 0 auto;
  max-width: 960px;}



	.tabs_icoo {width:100%;margin:0;padding:0;font-size:0.813em}
	.tabs_icoo li {
		list-style:none;
		width:33%;
		margin:0;
		padding:0;
		display:block;
		box-sizing:border-box;
		float:left;
		background-color:#fff;
	}
		
	.tabs_icoo li:first-child {width:34%;border:1px #666 solid;border-right:0}
	.tabs_icoo li:nth-child(2) {width:33%;border:1px #666 solid;border-right:0}
	.tabs_icoo li:last-child {width:33%;border:1px #666 solid;}


	.tabs_icoo a {
		padding:8px 10px;
		display:block;
		text-align:center;
		background:#555;
		color:#fff;
		text-decoration:none;
	}

	.tabs_icoo a.active {
		background:#ff5400;
		color:#fff;
	}

	.icoo_tabtitlev {clear:both;padding-top:20px;font-size:0.938em}

	.border_list {width:100%;border-collapse:collapse;}
	.border_list th {padding:6px 0;font-size:0.750em;font-weight:bold;background-color:#333;border-bottom:#eb5124 1px solid;text-align:center}
	.border_list td {height:28px;padding:5px 0;font-size:0.750em;border-bottom:#666 1px solid;text-align:center}

	.border_list .subject {padding-left:5px;text-align:left}


.col-md-89 {
	float:left;
	width:32%;
	margin-right:2%;
	font-size:13px;
	line-height:23px;
	background-image:url('../images/igrifo_companytbg.png');
	border:1px #888 solid;
	box-sizing:border-box;
	padding:8px 10px;
	font-size:15px;
	text-align:center;

	}
	.col-md-89:first-child {padding:22px 10px;}
	.col-md-89:nth-child(2) {padding:22px 10px;}
	.col-md-89:nth-child(3) {padding:22px 10px;}
	.col-md-49 {
	float:left;
	width:33%;
	font-size:13px;
	line-height:23px;

	}

	.col-md-59 {
	float:left;
	width:33%;
	font-size:13px;
	line-height:23px;
	}

	@media (max-width: 1024px) {
	.col-md-89, .col-md-49 .col-md-59 {
		float:left;
		width:100%;
		border:1px #666 solid;
		font-size:0.938em;
		color:#eee;
		line-height:23px;
		padding:5px 10px;
		letter-spacing:-1px;
		text-align:center;
		margin-bottom:0;
		}
	.col-md-89:first-child {padding:5px 10px;}
	.col-md-89:nth-child(2) {padding:5px 10px;}

	}
	
	img {
			position: relative;
			margin: 0 auto;
  max-width: 960px;}



.col-md-89:last-child {margin-right:0;letter-spacing:-1px;}

.comPcolor {color:#ff4800}
