@charset "utf-8";

/* Designer Minzzang 2013.05.13 */

@font-face {
	  
	font-family:'Lato';
	src:url(../Lato.eot);
	src:local(☺), url(../Lato.woff)format('woff')
  }
  
  

/*/////////////// TOP MENU ///////////////*/

header { 

	width:100%; height:100px;
	border-bottom:1px solid #ededed;
	background-color:white;
	box-shadow:1px 3px 10px rgba(0 ,0 ,0, 0.5);
	-moz-box-shadow:1px 3px 10px rgba(0 ,0 ,0, 0.5);
	-ms-box-shadow:1px 3px 10px rgba(0 ,0 ,0, 0.5);
	-o-box-shadow:1px 3px 10px rgba(0 ,0 ,0, 0.5);
	-webkit-box-shadow:1px 3px 10px rgba(0 ,0 ,0, 0.5);
	position:fixed;
	z-index:999;
}

.main_header {
	
	width:980px; height:100px;
	position:relative;
	margin:0px auto;

}

.main_header .logo {
	
	position:absolute;
	width:186px; height:48px;
	top:22px;
	
	

}

.main_header .top_menu li {
	
	display:inline-block;
	
}

.main_header .top_menu {
	
	position:absolute;
	right:20px; top:30px;
	
	
}

.main_header .top_menu a {
	
	display:block;
	padding:10px 20px;
	font-family:'Lato';
	font-size:15px;
	font-weight:bold;
	color:#37a1ca;
	background-color:white;
}

.main_header .top_menu a:hover,
.main_header .top_menu a:focus{
	
	color:#37a1ca;
	background-color:#eaeaea;

	border-radius:5px;
	-ms-border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;

}

.main_header .top_menu .active{
	
	color:#ffffff;
	background-color:#37a1ca;

	border-radius:5px;
	-ms-border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;
	transition:all 200ms ease-in 0s;
}


	
	

/*/////////////// SNS MENU ///////////////*/

.sns_menu li {
	
	display:inline-block;
	text-indent:-999em;	
	margin-left:5px;
}

.sns_menu{ 
    position:absolute;
	top:30px; right:20px;	
}

.sns_menu li a {
	
	    display:block;
		width:33px; height:34px;
		background:url(../images/sns_facebook.png);
}

.sns_menu p {
	
	margin-top:5px;
	font-weight:bold;
	color:#2a2a2a;
	line-height:15px;

	
}


.sns_menu li.facebook a { background:url(../images/sns_facebook.png) 0px 0px no-repeat; }
.sns_menu li.twitter a { background:url(../images/sns_twitter.png) 0px 0px no-repeat; }
.sns_menu li.linkedin a { background:url(../images/sns_linkedin.png) 0px 0px no-repeat; }

.sns_menu li.facebook a:hover { background:url(../images/sns_facebook.png) 0px -34px no-repeat; transition-duration:.5s; }
.sns_menu li.twitter a:hover { background:url(../images/sns_twitter.png)  0px -34px no-repeat; transition-duration:.5s;  }
.sns_menu li.linkedin a:hover { background:url(../images/sns_linkedin.png)  0px -34px no-repeat; transition-duration:.5s;  }


/*/////////////// CONTACT LIST ///////////////*/

#sub01_content { width:100%; height:600px; background:url(../images/header_img.jpg); background-size:cover; background-position:center; padding-top:100px;}
#sub01-1_content {width:100%; height:300px; background-color:#F6F6F6;}


#sub01-1_content .sub01_about { position:relative; width:1000px; height:300px; margin:0 auto; }
.about_contetnt li { display:inline-block; width:326px; list-style:none; }
.about_contetnt h2 { font-family:'Lato'; font-size:20px; font-weight:bold; color:#616161; letter-spacing:0px; text-align:center; line-height:10px;  }
.about_contetnt p { font-family:'Lato'; font-size:14px; color:#616161; letter-spacing:0px; text-align:center; line-height:17px; }
.about_contetnt img { display:block; padding-top:50px; padding-bottom:30px; margin:0 auto;}


#sub02_content { width:100%; height:950px; background:url(../images/parallax4.jpg); background-size:cover; background-attachment:fixed; position:relative; background-position: 50% 0; }

#sub03_content { width:100%; height:850px; background:white;}
#sub04_content { width:100%; height:100%; background: url(../images/dot_bg.png) #2A2A2A;}
#sub05_content { width:100%; height:650px; background-color:#f7f7f7; }
#sub05_content .copylight { width:100%; height:50px; background:#2A2A2A;  text-align:center; }
#sub05_content .copylight strong { font-family:'Lato'; font-weight:normal; font-size:13px;  color:#BEBEBE;font-weight:normal; line-height:50px; }


/*/////////////// SUB_PAGE ///////////////*/

.sub_page { width:980px; height:650px;  margin:0px auto; position:relative; z-index:99;}
.about_page { width:980px; height:600px;  margin:0px auto; position:relative;}
.about_page .about_logo { display:block; width:195px; height:224px; margin:0 auto; }

.about_page a { position:absolute; display:block; width:133px; height:24px; bottom:10px; right:10px;}
.about_page a.vimeo { background:url(../images/vimeo_bt.png); text-indent:-99999em; }
.about_page a.vimeo:hover { background:url(../images/vimeo_bt_r.png); text-indent:-99999em;}

.title_h2 {display:block; margin:0 auto; padding-top:170px; width:320px; height:52px; padding-bottom:15px;}
.black_p {font-family:'Lato'; font-size:14px; color:#616161; text-align:center; margin-bottom:34px; line-height:17px;}
.white_p {font-family:'Lato'; font-size:14px; color:#EDEDED; text-align:center; margin-bottom:34px; line-height:17px;}
.contaxt_h2 {padding-top:100px;}
.contaxt_p {font-family:'Lato'; font-size:14px; color:#616161; text-align:left; margin-bottom:34px; line-height:17px;}


/*///////// ABOUT PAGE //////////*/

.sub02_text .about_jeycorp {
	
	width:980px;
	margin:0px auto;
	padding-bottom:20px;
	padding-top:20px;
	


}

.sub02_text .about_jeycorp p {
	
	color:#EDEDED;
	line-height:20px;
	font-family:'Lato';
	letter-spacing:0px;
	font-size:15px;
}



.sub02_text {
	
	width:100%;
	background:url(../images/about_bg.png);
}

/*///////// ABOUT PAGE END //////////*/


#video_content { 


	position:absolute;
    left:140px;
	margin-bottom:40px;
	z-index:1;
}



.service_content li { 
	
	float:left;
	line-height:none;
	margin-top:50px;
	padding-left:10px;
	padding-right:10px;
	
}

/*////////// service_content img /////////////*/


.service_content a {
	
	display:block;
	width:220px; height:220px;
	border-radius:50%;
	-ms-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;
	-webkit-border-radius:50%;
}



	

/*////////// END /////////////*/


.service_content a.webdesign { border:2px solid #6891e9; background:url(../images/service_webdesign.png) 50% 50% no-repeat; cursor:default;}
.service_content a.mobile { border:2px solid #e58087; background:url(../images/service_mobile.png) 50% 50% no-repeat; cursor:default;}
.service_content a.character { border:2px solid #A4765C; background:url(../images/service_character.png) 50% 50% no-repeat; cursor:default;}
.service_content a.photography { border:2px solid #54c6e4; background:url(../images/service_photography.png) 50% 50% no-repeat; cursor:default;}

/*
.service_content a.webdesign:hover { 
	background:url(../images/service_webdesign_r.png) 50% 50% no-repeat; 
	background-color:#4470cf; 
	transition-duration:1.5s;
	-moz-transition-duration:1.5s;
	-ms-transition-duration:1.5s;
	-o-transition-duration:1.5s;
	-webkit-transition-duration:1.5s; 	 
}
.service_content a.mobile:hover { 
	background:url(../images/service_mobile_r.png) 50% 50% no-repeat; 
	background-color:#c53942; 
	transition-duration:1.5s;
	-moz-transition-duration:1.5s;
	-ms-transition-duration:1.5s;
	-o-transition-duration:1.5s;
	-webkit-transition-duration:1.5s; 	 
}
.service_content a.character:hover { 
	background:url(../images/service_character_r.png) 50% 50% no-repeat; 
	background-color:#A4765C; 
	transition-duration:1.5s;
	-moz-transition-duration:1.5s;
	-ms-transition-duration:1.5s;
	-o-transition-duration:1.5s;
	-webkit-transition-duration:1.5s; 	 
}
.service_content a.photography:hover { 
	background:url(../images/service_photography_r.png) 50% 50% no-repeat; 
	background-color:#099FC7; 
	transition-duration:1.5s;
	-moz-transition-duration:1.5s;
	-ms-transition-duration:1.5s;
	-o-transition-duration:1.5s;
	-webkit-transition-duration:1.5s; 
}

*/



.service_content li h3 {
	

	margin-top:65px;
	margin-bottom:18px;
	text-align:center;
}

.service_content li p {
	
	font-family:'Lato';
	font-size:14px;
	color:#616161;
	line-height:17px;
	text-align:center;
}

.address_guide { display:block; float:right;}
.location { float:right;}
.location h4 { 
margin-bottom:20px;
	font-family:'Lato';
	font-size:25px;
	color:#4a4a4a;
}

.location p {
	font-family:'Lato';
	font-size:14px;
	margin-bottom:20px;
	color:#616161;
}

.location li {
	line-height:0px;
	padding-bottom:5px;
}

.location li p {
		font-family:'Lato';
	font-size:14px;
	line-height:0px;
	padding-bottom:5px;
	color:#616161;
}






.big_sns li  { display:inline-block;margin-right:10px; }
.big_sns li a { width:69px; height:71px; display:block; }
.big_sns li a.big_facebook{ background:url(../images/big_facebook.png) 0px 0px no-repeat; }
.big_sns li a.big_twitter { background:url(../images/big_twitter.png) 0px 0px no-repeat; }
.big_sns li a.big_linkedin  { background:url(../images/big_linkedin.png) 0px 0px no-repeat; }

.big_sns li a.big_facebook:hover { background:url(../images/big_facebook.png) 0px -71px no-repeat; transition-duration:.5s;}
.big_sns li a.big_twitter:hover { background:url(../images/big_twitter.png) 0px -71px no-repeat; transition-duration:.5s;}
.big_sns li a.big_linkedin:hover { background:url(../images/big_linkedin.png) 0px -71px no-repeat; transition-duration:.5s;}




/*/////////////////// port menu //////////////////////*/

.port_button { text-align:center; margin-bottom:34px; z-index:99;}
.port_button li { display:inline-block; margin-right:10px; }

.port_button li a { 
	
	display:block;
	padding:10px 10px;
	font-family:'Lato';
	font-weight:bold;
	letter-spacing:0px;
	font-size:15px;
	color:#ededed;


	
	border-radius:5px;	
	-ms-border-radius:5px;	
	-moz-border-radius:5px;
	-o-border-radius:5px;
	-webkit-border-radius:5px;
	

}

.port_button li a.port_app { background-color:#4470cf;}
.port_button li a.port_web { background:#c53942;}
.port_button li a.port_logo { background:#a4765c;}
.port_button li a.port_character { background:#099fc7;}

.port_button li a:hover,
.port_button li a.selected { background:#595959; transition:all 200ms ease-in 0s;}

#map {
	
	float:left;
}

/* ////////////   Port-isotope      ////////// */

.port_page { 

	position:relative;
	width:980px; height:100%;  
	margin:0px auto;
	padding-bottom:100px;
	z-index:99;


	
}



.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

.element {
	
	float:left;

	width:232px; height:189px;
	margin:5px;
	text-align:center;
}

.app {
	
	padding-top:10px;
}

.web {
	

}

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}




/*///////////////////// PARTNER CONTENT //////////////////////////*/
.partner_content {
	
	width:100%; height:110px;
	background:#f6f6f6;
	
}

.partner_content .partner_page {
	
	position:relative;
	width:980px; height:100%;
	margin:0 auto;
	padding-top:25px;
}


.scroller_roll{
	position:absolute;
	height:61px;
    margin: 0px;
    overflow: hidden;
	margin:0 auto;
}

.scroller_roll img{
	width:150px;
	height:61px;
}
.scroller_roll ul{
    padding: 0px;
    margin: 0px;
    float: left;
}
.scroller_roll ul li{
    padding: 0px;
    margin: 0px;
    list-style: none;
    float: left;
    text-align: center;
    display:inline;
}

/*///////////////////// LINK CONTENT //////////////////////////*/

.link_content {
	
	width:100%; height:100%;
	background:url(../images/parallax2.jpg);
	background-attachment:fixed;
	background-size:cover;
	background-position:center;
}

.link_content .link_page {
	
	position:relative;
	width:980px; height:450px;
	margin:0 auto;
}

.link_page h2 img {
	
	display:block;
	padding-top:100px;
	margin:0 auto;
}

.link_page .link {
	
	position:absolute;
	widht:540px;
	bottom:100px;
	left:50%;
	margin-left: -260px;
	z-index:88;
}

.link_page span a {
	
	display:inline-block;
	width:220px; height:50px;
	font-family:'Lato';
	color:#eaeaea;
	font-size:15px;
	text-align:center;
	line-height:50px;
	font-weight:bold;
	border-radius:5px;
	margin:0px 20px;
}

.link_page span a.afrodesign {background:#5273ba;}
.link_page span a.fryfun {background:#cc3d3d;}

.link_page span a.afrodesign:hover,
.link_page span a.fryfun:hover
{background:#2a2a2a; transition-duration:.5s;}


/* ///////////////////////////////////////// 
	=Global Classes
///////////////////////////////////////// */

.clearfix:after {
	content: "";
	display: block;
	clear: both;
	}
	.ie6 .clearfix { height: 1px; } /* IE6 */ 
	.ie7 .clearfix { min-height: 1px; } /* IE7 */