@charset "utf-8";



/* ==========================================================================
관리자 내용 버튼
========================================================================== */
.btn_admin{
	position: fixed;
	left:20px;
	bottom:10px;
	outline: none;
	color: #fff;
	text-decoration: none;
	}

/* ==========================================================================
서브 상단 레이아웃
========================================================================== */
 .sub_header {
	padding-top: 7rem;
	margin-bottom: 0;
	background: #000 url(img/title_main.jpg) no-repeat center bottom;
	background-size: cover;
	border-radius: 0;
	}

.center-vertically, .center-vertically:before { 
	display: table;
	width: 100%;
    height: 500px;
    padding: 0; 
	}

.center-vertically:before { 
	position: absolute;
    top: 0px;
    left: 0px;
    content: '';
    background: transparent url(img/pattern.png) repeat top left;	
	}


/* ==========================================================================
서브 상단 타이틀
========================================================================== */
.sub_hero h1 {
	font-family: 'Noto Sans KR',sans-serif;
	font-size:50px;
	font-weight:500;
    color: #fff;
    margin-top: 30px; 
	}

.sub_hero p {
	font-family: 'Noto Sans KR',sans-serif;
	font-size:23px;
	font-weight:400;
    color: #fff;
	}
  
.sub_hero .hero-content {
    padding-top: 26%; 
	}

/* ==========================================================================
선택별 노출
========================================================================== */
.event img{padding:10px}
.ss_bt img{padding:20px 0 20px 0}



.Portfolio-nav{
	padding-top:30px;
	margin:0 0 45px 0;
	list-style:none;
	text-align:center;
	}

.Portfolio-nav li{
	margin:0 10px;
	display:inline;
	}

.Portfolio-nav li a{
	display:inline-block;
	padding:10px 22px;
	font-size:12px;
	line-height:20px;
	color:#222222;
	border-radius:4px;
	text-transform:uppercase;
	font-family: 'Montserrat', sans-serif;
	background:#f7f7f7;
	margin-bottom:5px;
	transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	}

.Portfolio-nav li a:hover{
	background:#3477ce;
	color:#fff;
	text-decoration:none;
	}

.portfolioContainer{
	margin:0 auto;
	padding-left:15px;
	}

.portfolioContainer h3{
	font-size:12px;	
	}

.portfolioContainer p{
	margin-top:-10px;	
	}



.Portfolio-box{
	text-align:center;
	margin-bottom:30px;
	height:500px;
	width:225px;
	overflow:hidden;
	float:left;
	padding:0;
	}

.Portfolio-box img{	
	transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;	
	}

.Portfolio-box img:hover {
	opacity: 0.6;
	}

.Portfolio-nav li a.current{
	background:#0c4da2;
	color:#fff;
	text-decoration:none;
	}

img {
	max-width:100%;
	}

/* no transition on .isotope container */

.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.6s;
     -moz-transition-duration: 0.6s;
          transition-duration: 0.6s;
	}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
          transition-property:         transform, opacity;
	}

.portfolioContainer{
	max-width: 1140px;
	}






@media only screen and (max-width: 479px) {
	/****Mobile Portrait 320 ****/
.Portfolio-nav li a{ padding:5px 16px;}
	.Portfolio-nav li{ display:block;}
	.Portfolio-box{  max-width:300px !important; width:96.4% !important; margin:0 !important}
	.Portfolio-box img { max-width:100%;}
	.portfolioContainer{ width:280px !important; margin:0 auto !important }

}