/*!
 * Start Bootstrap - Agency v3.3.7+1 (http://startbootstrap.com/template-overviews/agency)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); 
@import url("//hello.myfonts.net/count/3405ea");
@import url("//hello.myfonts.net/count/34129d");

@font-face {font-family: 'Gilroy-ExtraBold';src: url('/font/webfonts/3405EA_0_0.eot');src: url('webfonts/3405EA_0_0.eot?#iefix') format('embedded-opentype'),url('/font/webfonts/3405EA_0_0.woff2') format('woff2'),url('/font/webfonts/3405EA_0_0.woff') format('woff'),url('/font/webfonts/3405EA_0_0.ttf') format('truetype');}
@font-face {font-family: 'Gilroy-Light';src: url('/font/webfonts/34129D_0_0.eot');src: url('/font/webfonts/34129D_0_0.eot?#iefix') format('embedded-opentype'),url('/font/webfonts/34129D_0_0.woff2') format('woff2'),url('/font/webfonts/34129D_0_0.woff') format('woff'),url('/font/webfonts/34129D_0_0.ttf') format('truetype');}

body {font-family: 'Noto Sans KR', sans-serif; min-width:1280px;}
.row {margin-left:0; margin-right:0;}
.text-muted { color: #777777; }
.text-primary { color: #fed136; }
ul, ol, li {padding:0; margin:0; list-style: none;}
p { font-size: 14px; line-height: 1;  letter-spacing: -0.04em; }
p.large { font-size: 16px; }
a, a:hover, a:focus, a:active, a.active { outline: none; text-decoration: none;  letter-spacing: -0.04em; }
a {color: #bc1f2d; }
a:hover, a:focus, a:active, a.active { color: #bc1f2d; }
h1, h2, h3, h4, h5, h6 {  font-weight: 400;  letter-spacing: -0.04em; }
.img-centered { margin: 0 auto; }
.btn-primary { color: white; background-color: #bc1f2d; border-color: #bc1f2d; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,
.open .dropdown-toggle.btn-primary {
  color: white; background-color: #fec503; border-color: #f6bf01;
}

.btn-primary:active, .btn-primary.active,
.open .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #bc1f2d;
  border-color: #bc1f2d;
}
.btn-xl {
  color: white; background-color: #bc1f2d; border-color: #bc1f2d;
  font-weight: 700; border-radius: 0;
  font-size: 18px; line-height: 57px; padding:0; 
  transition: all .3s;
  width: 201px; height: 57px; box-sizing: border-box;
}
.btn-xl:hover, .btn-xl:focus, .btn-xl:active,
.btn-xl.active, .open .dropdown-toggle.btn-xl {
  color: #fff; background-color: #343434;
  border-color: #343434;
}
.btn-xl:active, .btn-xl.active,
.open .dropdown-toggle.btn-xl {
  background-image: none;
}
.btn-xl.disabled,
.btn-xl[disabled],
fieldset[disabled] .btn-xl,
.btn-xl.disabled:hover,
.btn-xl[disabled]:hover,
fieldset[disabled] .btn-xl:hover,
.btn-xl.disabled:focus,
.btn-xl[disabled]:focus,
fieldset[disabled] .btn-xl:focus,
.btn-xl.disabled:active,
.btn-xl[disabled]:active,
fieldset[disabled] .btn-xl:active,
.btn-xl.disabled.active,
.btn-xl[disabled].active,
fieldset[disabled] .btn-xl.active {
  background-color: #fed136;
  border-color: #fed136;
}
.btn-xl .badge {
  color: #fed136;
  background-color: white;	
}

/************** navbar *********************/
.navbar-custom {
  background-color: rgba(255,255,255,.6);
  border-bottom: 2px solid #bc1f2d;
  box-shadow: 0 5px 20px rgba(0,0,0,.3);
}
.navbar-custom .navbar-brand {
  display: inline-block; width: 205px; height: 55px; 
  background: url('/images/logo.png') no-repeat; background-size: cover; 
  text-indent: -9999em; overflow: hidden; color: #fff; 
  margin-left:0;
}
.navbar-custom .navbar-plusfrient {
  display: inline-block; width: 100px; height: 55px; 
  background: url('/images/kakao.png') no-repeat; background-size: cover; 
  text-indent: -9999em; overflow: hidden; color: #fff; 
  margin-left:0;
}

.navbar-custom .navbar-collapse {
  border-color: rgba(255, 255, 255, 0.02);
}
.navbar-custom .navbar-toggle {
  background-color: #bc1f2d;
  border-color: #bc1f2d;
  color: white;
  font-size: 12px;
}
.navbar-custom .navbar-toggle:hover,
.navbar-custom .navbar-toggle:focus {
  background-color: #bc1f2d;
}
.navbar-custom .nav li {height: 100%;}
.navbar-custom .nav li a {
  font-family: 'Noto Sans KR', sans-serif;  letter-spacing: -0.04em;
  font-size: 20px; font-weight: 500; line-height: 40px; 
  height: 100%; 
  color: #343434;
  padding-top: 30px;
  padding-bottom: 30px;
}
.navbar-custom .nav li a:hover,
.navbar-custom .nav li a:focus {
  color: #bc1f2d;
  outline: none;
}
.navbar-custom .navbar-nav {height: 94px; }

.navbar-custom .navbar-nav > .active > a {
  border-bottom: 9px solid #bc1f2d;
  background-color: transparent;
  color:#bc1f2d;
}
.navbar-custom .navbar-nav > .active > a:hover,
.navbar-custom .navbar-nav > .active > a:focus {
  border-bottom: 9px solid #bc1f2d;
  background-color: transparent;
  color:#bc1f2d;
}
@media (min-width: 768px) {
  .navbar-custom {
	padding: 0;
    -webkit-transition: padding 0.3s;
    -moz-transition: padding 0.3s;
    transition: padding 0.3s;
  }
  .navbar-custom .navbar-brand {
    font-size: 2em;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
  }
  .navbar-custom .navbar-nav > .active > a {
    
  }
}
@media (min-width: 768px) {
  .navbar-custom.affix {
    padding: 0;
  }
  .navbar-custom.affix .navbar-brand {
    font-size: 1.5em;
  }
}

#mainNav .container {width: 1286px; padding-left:0; padding-right:0; }
#mainNav .container .navbar-header { width: 205px; height: 55px; margin-top:19px;}

/* 일반 pc */
@media screen and (max-width:1285px) {
	#mainNav .container { width: 90%;  }
	#mainNav .container .nav > li > a { margin-left: 30px; }
	#mainNav .container .navbar-right { margin-right: 0;}

	
}
/* 최소 사이즈 처리 */
@media screen and (max-width:480px) {
	#mainNav .container { min-width:320px; }
}





/************** header *********************/
header { width: 100%; height: 100vh; text-align: left; color: #343434; }
header #mainSlide .carousel-caption {height: 100%; width: 1286px; margin-left: -693px; }
header #mainSlide .carousel-caption p { position: absolute; left:0px; top: 40.54vh; font-size: 34px; margin: 0;  }
header #mainSlide .carousel-caption h3 { position: absolute; left:0; top: 45.66vh; font-weight: 400; line-height: 1; font-size: 73px; margin-top:0;  letter-spacing: -0.02em; }
header #mainSlide .carousel-caption a.btn {position: absolute; left:0; top: 57.27vh;  letter-spacing: -0.02em;}
header #mainSlide .carousel-inner > .item {height: 100vh; }
header #mainSlide .carousel-inner > .item img {width: auto; height: 100%; margin: 0 auto;}
header #mainSlide .carousel-inner .item:nth-child(1) { background-color: #f9f9f9;}
header #mainSlide .carousel-inner .item:nth-child(2) { background-color: #1b1a1a;}
header #mainSlide .carousel-inner .item:nth-child(3) img { width: 100%; }
header #mainSlide .carousel-inner .item:nth-child(3) .carousel-caption p {top: 42.54vh;}
header #mainSlide .carousel-inner .item:nth-child(3) .carousel-caption h3 {top: 47.66vh;}
header #mainSlide .carousel-inner .item:nth-child(3) .carousel-caption a.btn {top: 59.27vh;}
@media screen and (max-width:1285px) {
	header #mainSlide .carousel-caption {width: 90%; left: 5%; margin-left: 0; }
}









/************** Now PLAY Section *********************/
section#play {background-color: #252525; height: 800px; }
section#play .container { position: relative; height: 760px; }

section#play .slide_wrap {width: 100%; height: 650px; position:absolute;} /*  bottom: 6vh; */
section#play .slide_wrap .arrow img {position: absolute; cursor: pointer; }
section#play .slide_wrap .arrow #prev { left:80px; top: calc((103vh - 53px)/2);}
section#play .slide_wrap .arrow #next {right:80px; top: calc((103vh - 53px)/2); }

section#play .slide_wrap .slide_box { width: 865px; margin-left: -432px; height: 630px; position: absolute; left: 50%; top:90px; overflow:hidden;  }
section#play .slide_wrap .slide_box .list_wrap { width: 5190px; margin-left: -865px; position: relative; padding:0; }
section#play .slide_wrap .slide_box .list_wrap .list_box {width: 865px; float:left; bottom:0; height: 630px; position: relative; }
section#play .slide_wrap .slide_box .list_wrap .list_box h2 { height: 75px; position: absolute; top: 0; left: 50%; text-indent: -9999em; color: #fff; overflow: hidden; }

section#play .slide_wrap .slide_box .list_wrap .list_box .rank-heading { background: url('/images/rank_title.png'); width: 264px;  margin-left: -132px; }
section#play .slide_wrap .slide_box .list_wrap .list_box .new-heading { background: url('/images/new_title.png'); width: 214px; height: 75px; margin-left: -107px; }
section#play .slide_wrap .slide_box .list_wrap .list_box .ingi-heading { background: url('/images/ingi_title.png'); width: 210px;  margin-left: -105px; }
section#play .slide_wrap .slide_box .list_wrap .list_box .coming-heading { background: url('/images/coming_title.png'); width: 264px;  margin-left: -132px; }
section#play .slide_wrap .slide_box .list_wrap .list_box .pooq-heading { background: url('/images/pooq_title.png'); width: 264px;  margin-left: -132px; }

section#play .slide_wrap .slide_box .list_wrap .list_box .list {width: 865px; float:left;  margin:0; padding:0; position: absolute; bottom: 0;}
section#play .slide_wrap .slide_box .list_wrap .list_box .list li { width: 165px; height: 230px; position: relative; float:left; margin-right: 10px; margin-bottom: 10px; overflow:hidden;  }
section#play .slide_wrap .slide_box .list_wrap .list_box .list li:nth-child(5n) {margin-right: 0;}
section#play .slide_wrap .slide_box .list_wrap .list_box .list li img {width: 100%; }

section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc {position: absolute; width: 100%; height: 100%;  box-sizing: border-box; 
background-color: rgba(188,31,45,.9); top:0; padding: 20px; transition: all .3s; opacity:0; }
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc p {color: #fff; margin-bottom: 0; overflow: hidden;  text-overflow: ellipsis; white-space: nowrap; width: 100%;}
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc span.desc_title {font-size: 21px; color: #fff; overflow: hidden;  text-overflow: ellipsis; white-space: nowrap; width: 100%; display: block;  }
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc span.star { font-size: 12px; color: #fff;}
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc span.star i {margin-right: 2px; }
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc p.info {font-size: 11px; color: #dadada; margin: 10px 0; }
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc p.dir {font-size: 12px; line-height: 1.2;  }
section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc a.play-link {position: absolute; left: 50%; margin-left: -40%; bottom:17px; display: inline-block; 
width: 80%;  padding: 0.1vh 0; line-height: 44px; border-radius: 20px; background-color: #9c111d; color: #fff; text-align: center;}
section#play .slide_wrap .slide_box .list_wrap .list_box .list li:hover .movie_desc {opacity: 1;}

.playModal #close_modal { position: absolute; display: block; width: 35px; height: 35px; right: 0; top: -35px; }
.playModal .modal-content {width:804px; height: 458px; background-color: rgba(255,255,255,.94); }
.playModal .poster_modal {float:left; width: 298px;height: 458px;}
.playModal .poster_info {width: 506px; height: 458px; overflow:hidden; box-sizing: border-box; padding: 30px;}
.playModal .poster_info .title_ko {font-size: 27px;  }
.playModal .poster_info .title_en {margin-left: 10px; font-size: 21px; font-family: 'Gilroy-ExtraBold';  }
.playModal .poster_info .info {margin: 0 0 3px; font-size: 14px; line-height: 1.3; }
.playModal .poster_info .star-rating {color: #bc1f2d;}
.playModal .poster_info .star-rating i {margin-right: 2px; }
.playModal .story-heading {font-weight: bold; margin: 20px 0 13px; font-size: 18px;  }
.playModal .story {font-size: 13px; line-height: 1.5; }

@media screen and (max-width:1285px) {
	section#play .container {width: 90%; margin-left: 5%;  }
	section#play .container .section-heading {width: 304px; height: 71px; margin-left: -152px;  background-size: cover; top: 15.4vh; }
	section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc {  padding: 18px;  }
	section#play .slide_wrap .slide_box .list_wrap .list_box .list li .movie_desc span.desc_title {font-size:18px; }
}






/************** Ui Section *********************/
section#ui {
	background:url('/images/pattern.jpg') repeat; 
	position: relative; height: 100vh;
}
section#ui .container { position: relative; height: 100%; }
section#ui .container #ui_slide { width: 752px; height: 389px; background-color: red;
    background: url('/images/ui_view.png'); background-size: cover;
    position: absolute; right: 0; bottom: 21%; z-index: 99; 
}
section#ui .container .section-heading {font-size: 60px; font-family: 'Noto Sans KR'; position: absolute; top: 45.2vh;  letter-spacing: -0.06em;}
section#ui .container .section-subheading {font-size: 36px; font-family: 'Noto Sans KR'; position: absolute; top: 54.7vh;  letter-spacing: -0.05em;}

section#ui .container #ui_slide .slide_frame { width: 559px; height: 344px; position: absolute; top: 8px; left: 97px; overflow: hidden;}
section#ui .container #ui_slide .slide_frame ul {  position: relative;   }
section#ui .container #ui_slide .slide_frame ul li {width: 559px; height: 344px;  position: absolute; top:0; background-size: cover; 
    background-position: left top; background-repeat: no-repeat; background-color: #000; }
section#ui .container #ui_slide .slide_frame ul li:nth-child(1) {background-image: url('/images/ui_slide01.jpg');}
section#ui .container #ui_slide .slide_frame ul li:nth-child(2) {background-image: url('/images/ui_slide02.jpg');}
section#ui .container #ui_slide .slide_frame ul li:nth-child(3) {background-image: url('/images/ui_slide03.jpg');}
section#ui .container #ui_slide .slide_frame ul li:nth-child(4) {background-image: url('/images/ui_slide04.jpg');}
section#ui .container #ui_slide .slide_frame ul li:nth-child(5) {background-image: url('/images/ui_slide05.jpg');}
section#ui .container #ui_slide .slide_frame ul li:nth-child(6) {background-image: url('/images/ui_slide01.jpg');}
section#ui .container .grade {position: absolute; top: 23.44vh; left:0;  }	
section#ui .ui_bottom { background-color: #bc1f2d; position: absolute; bottom:0; width: 100%; height: 34.31vh; margin:0;}
section#ui .ui_bottom .num-inc {color:#fff;}
section#ui .ui_bottom .num-inc p {display: inline-block; margin: 50px 85px 0 0; font-size: 24px;  letter-spacing: -0.06em; }
section#ui .ui_bottom .num-inc p span {font-size: 55px;  letter-spacing: -0.04em; }
section#ui .ui_bottom .num-inc #date { color: #fff; font-size: 16px; background-color: #9c1824; padding: 10px 20px; border-radius: 20px; 
margin: 50px 0 0 270px; letter-spacing: 0;}
@media screen and (max-width:1285px) {
	section#ui .container { width: 90%; margin-left: 5%;  }
	section#ui .container img.grade { width: 162px; }
	section#ui .container #ui_slide { width: 676px; height: 349px; bottom: 19%; }
	section#ui .container #ui_slide .slide_frame { width: 503px; height: 310px; top: 6px; left: 87px; }
	section#ui .container #ui_slide .slide_frame ul li { width: 503px; height: 310px;}
	
	section#ui .container .section-heading { font-size: 54px; }
	section#ui .container .section-subheading {font-size: 32px; }
	section#ui .ui_bottom .num-inc p { font-size: 21px; margin: 45px 76px 0 0; }
	section#ui .ui_bottom .num-inc p span {font-size: 49px; }
}





/************** Movienet TV Section *********************/
section#movienet {padding:0; height:950px; }
section#movienet #myCarousel .carousel-caption {top: 120px; text-align: center; width: 1286px; margin-left: -643px;}

section#movienet #myCarousel .carousel-inner .item .carousel-caption h1 {height: 120px; display: inline-block;  color: black; overflow: hidden; margin: 0;}
/*
section#movienet #myCarousel .carousel-inner .contents .carousel-caption h3 {background:url('/images/movienet_title01.png'); width: 193px; }
section#movienet #myCarousel .carousel-inner .service .carousel-caption h3 {background:url('/images/movienet_title02.png'); width: 245px;}
section#movienet #myCarousel .carousel-inner .device  .carousel-caption h3 {background:url('/images/movienet_title03.png'); width: 438px; height: 91px;}
*/
section#movienet #myCarousel .carousel-inner .item .slide_img { position: absolute; top:30px; }
section#movienet #myCarousel .carousel-caption p { color: #252525;	text-shadow: none;	font-size: 25px;	line-height: 1.4;  letter-spacing: -0.02em;
    text-transform: none; font-weight: 400;  font-family: 'Noto Sans KR', sans-serif; }
section#movienet #myCarousel .carousel-caption p.service_ps { font-weight: bold; font-size: 23px; }

@media screen and (max-width:1285px) {
	
	section#movienet {padding:0; height: 1200px; }
	section#movienet #myCarousel .carousel-caption { width: 1200px; text-align: center; margin-left: -600px; top:120px;}
	section#movienet #myCarousel .carousel-indicators { bottom: 20px; }
	section#movienet #myCarousel .carousel-inner .contents .carousel-caption h1 { width: 277px; height: 100px; background-size: cover; }
	section#movienet #myCarousel .carousel-inner .service .carousel-caption h1 { width: 220px; height: 80px; background-size: cover; }
	section#movienet #myCarousel .carousel-inner .device .carousel-caption h1 { width:472px; height: 82px; background-size: cover; }
	section#movienet #myCarousel .carousel-caption p { font-size: 22px;  line-height: 27px; }
}







/************** Portfolio Section *********************/
section#work { background-color: #252525; }
section#work .container {height: 100vh; position: relative;  padding: 100px 0; box-sizing: content-box; }
section#work .container  .section-heading { position: absolute; top:  0; left: 50%; margin-left: -144px; width: 288px; height: 72px; 
background: url('/images/work_title.png'); text-indent: -9999em; color: #fff; overflow: hidden; display: inline-block; }
section#work .container .section-subheading {position: absolute; top: 12vh; width: 100%; text-align: center; color: #fff; font-size: 25px;  letter-spacing: -0.04em; line-height: 36px; font-family: 'Noto Sans KR'; font-weight: 300; }
section#work .work_box { width: 1286px; height: 635px; position: absolute; top: 35%; }
section#work .portfolio-item { float: left;  width: 312px; height: 306px; overflow: hidden; padding: 0; }
section#work .portfolio-item:nth-child(1){ height: 623px; background: url('/images/work_01.jpg') center top no-repeat; margin-right: 13px;}
section#work .portfolio-item:nth-child(2) {background: url('/images/work_02.jpg') center top no-repeat; margin-right: 12px;}
section#work .portfolio-item:nth-child(3) {background: url('/images/work_03.jpg') center top no-repeat; margin-right: 13px;}
section#work .portfolio-item:nth-child(4) {background: url('/images/work_04.jpg') center top no-repeat; }
section#work .portfolio-item:nth-child(5) {background: url('/images/work_05.jpg') center top no-repeat; margin-right: 12px; margin-top: 11px;}
section#work .portfolio-item:nth-child(6) {background: url('/images/work_06.jpg') center top no-repeat; margin-right: 13px; margin-top: 11px;}
section#work .portfolio-item:nth-child(7) {background: url('/images/work_07.jpg') center top no-repeat; margin-top: 11px;}

section#work .portfolio-item .portfolio-link { display: block; position: relative; max-width: 400px; margin: 0 auto; }
section#work .portfolio-item .portfolio-link .portfolio-hover { background: rgba(254, 209, 54, 0.9); position: absolute; width: 100%; height: 100%; opacity: 0; 
  transition: all ease 0.5s; -webkit-transition: all ease 0.5s;  -moz-transition: all ease 0.5s; }
section#work .portfolio-item .portfolio-link .portfolio-hover:hover { opacity: 1; }
section#work .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
  position: absolute; width: 100%; height: 20px; font-size: 20px;
  text-align: center; top: 50%; margin-top: -12px; color: white;
}
section#work .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i { margin-top: -12px; }
section#work .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
section#work .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {  margin: 0;}

section#work .portfolio-item .portfolio-caption { margin: 0 auto; background-color: #3f3f3f; text-align: left; padding: 20px 25px; position: relative; bottom: -243px; transition: all .3s;}
/*section#work .portfolio-item .portfolio-caption { bottom: -235px; }*/
/*section#work .portfolio-item:hover .portfolio-caption { bottom:-170px; background-color: #bc1f2d; } */
section#work .portfolio-item:hover .portfolio-caption { bottom:0px; background-color: #bc1f2d; } 

section#work .portfolio-item:first-child .portfolio-caption { bottom: -560px; }
/*section#work .portfolio-item:first-child:hover .portfolio-caption { bottom: -478px;} */
/*section#work .portfolio-item:hover .portfolio-caption { bottom: 0px;}*/

section#work .portfolio-item:first-child:hover .portfolio-caption { bottom:0px;} 
section#work .portfolio-item .portfolio-caption h4 { text-transform: none; margin: 0 0 22px; color: #fff; font-size: 21px;}
section#work  .portfolio-item .portfolio-caption p { font-size: 14px; margin: 0; font-weight: bold; color: #ecd9db;  line-height: 1.3;}
section#work  * {  z-index: 2;}
section#work .portfolio-item { margin: 0;}
@media screen and (max-width:1285px) {
	section#work {height: 1157px; }
	section#work .container { width: 90%;  }
	section#work .container .section-heading { width: 260px; height: 65px; margin-left: -129px; background-size: cover; }
	section#work .container .section-subheading {font-size: 22px; line-height: 32px; }
	section#work .work_box { width: 100%; height: 593px; }
	section#work .portfolio-item { width: 24.2%; height: 290px; background-size: cover;}
	section#work .portfolio-item:nth-child(1) {height: 593px; margin-right: 1%; }
	section#work .portfolio-item:nth-child(2) {margin-right: 1%;}
	section#work .portfolio-item:nth-child(5) {margin-right: 1%; margin-top: 13px;}
	section#work .portfolio-item:nth-child(6), section#work .portfolio-item:nth-child(7) {margin-top: 13px;}

/*	section#work .portfolio-item:hover .portfolio-caption { bottom:-172px; } */
/*	section#work .portfolio-item:first-child:hover .portfolio-caption { bottom: -478px;} */
	section#work .portfolio-item .portfolio-caption h4 { font-size: 18px; }
	section#work  .portfolio-item .portfolio-caption p { font-size: 14px; }
}






/************** Contact us section *********************/
.p_bold {font-weight: 700; font-size: 17px; }
section#contact { background-color: #fff; background-position: center; background-repeat: no-repeat;min-width:1200px;}
section#contact>.container { height: 45vh; position: relative; padding:0; } 
section#contact .container .section-heading {position: absolute; top: 17.4vh; left: 50%; margin-left: -187px; display: inline-block; 
width: 374px; height: 71px; text-indent: -9999em; color: #fff; overflow: hidden; background: url('/images/contact_title.png'); }
section#contact .section-subheading {width: 100%; text-align: center; font-size: 25px; position: absolute; top: 30vh;  letter-spacing: -0.06em; font-weight: 300; }

section#contact .bg { background: url('/images/contact_bg.jpg') no-repeat; background-size: cover;  }
section#contact .contact-mid .container { padding: 3% 0;  }
section#contact .contact-mid .container .contact-icon { position: relative; width: 25%; height: 27vh; color: #fff; text-align: center; background: url('/images/cir.png')no-repeat; 
background-size: contain; background-position-x: center;}
section#contact .contact-mid .container .contact-icon i { font-size: 50px; position: absolute; top: 29%; left: 50%; display: block;  }
section#contact .contact-mid .container .contact-icon p {font-size: 18px; line-height: 1.3;  letter-spacing: -0.04em; position: absolute; top: 55%; text-align: center; width: 100%;}
section#contact .contact-mid .container .contact-icon .icon_p { letter-spacing: -0.1em;}

section#contact .contact-mid .container .contact-icon:nth-child(1) i { margin-left: -21px;}
section#contact .contact-mid .container .contact-icon:nth-child(2) i {margin-left: -25px;}
section#contact .contact-mid .container .contact-icon:nth-child(3) i {margin-left: -32px;}
section#contact .contact-mid .container .contact-icon:nth-child(4)  i {margin-left: -29px;}

section#contact .cont_form {width: 510px; float: right; }
section#contact .cont_form p { font-size: 21px; font-family: 'Noto Sans KR'; line-height: 1.4; margin:0;  letter-spacing: -0.02em; }
section#contact .contact-msg {background-color: rgba(0,0,0,.3); color: #fff; padding: 4% 0;}
section#contact .contact-msg .container {}
section#contact .contact-msg .container .phone {font-size: 39px; line-height: 1.4em; }
section#contact .contact-msg .container .k_store {margin-top: 30px; float: left;  }
section#contact .contact-msg .container .k_store ul li {float:left;}
section#contact .contact-msg .container .k_store ul li p {margin-bottom:0; font-size: 13px; line-height: 19px;  letter-spacing: -0.02em; text-decoration: none; }
section#contact .contact-msg .container .k_store ul li:nth-child(2) {margin-right: 67px; margin-left: 67px; }
section#contact .contact-msg .container .g_store {clear: both; padding-top: 50px; float: left; }
section#contact .contact-msg .container .g_store ul li {float: left; text-align: center; margin-right: 17px;  }
section#contact .contact-msg .container .g_store ul li p {margin: 10px auto; }

section#contact #contactForm {margin-top: 50px; overflow: hidden; }
section#contact #contactForm .c_form { float: left; width: 60%; }
section#contact #contactForm .c_form input{ height: auto; width: 171px;	background: transparent;	border: none; box-shadow: none;
    border-bottom: 1px solid #fff; border-radius: 0; color: #eee; }
section#contact #contactForm .left_input { width: 40%; }
section#contact #contactForm .left_input  input {width: 101px;}
section#contact label{text-align: left; padding-top: 8px; margin-bottom:0; font-size: 17px; margin-right: 40px;  letter-spacing: -0.02em;  }
section#contact textarea { width: 510px; height: 116px; background: #a41724;}


section#contact label[for=message] {margin-top: 20px; margin-bottom:5px; font-size: 17px; }
section#contact textarea { height: 140px; background: rgba(255,255,255,.3); border: none; box-shadow: none; resize: none; color: #eee; }
input:focus, textarea:focus {outline: none !important; }

section#contact .form-control:focus { border-color: #bc1f2d; box-shadow: none;}
section#contact ::-webkit-input-placeholder { color: #eeeeee; }
section#contact :-moz-placeholder {  /* Firefox 18- */ color: #eeeeee; }
section#contact ::-moz-placeholder {  /* Firefox 19+ */ color: #eeeeee; }
section#contact :-ms-input-placeholder { color: #eeeeee; }
section#contact .text-danger { color: #e74c3c; }
section#contact .contact-btn { border-color:#fff; background-color: #fff; border-radius:0; font-weight: 700;  letter-spacing: -0.02em;
  font-size: 18px; line-height: 50px; transition: all .3s; margin: 30px 0 0; color:#252525; width: 210px; height: 50px; }
section#contact .contact-btn:hover, 
.contact-btn:focus, .contact-btn:active, .contact-btn.active {
  color: white; background-color: #343434; border-color: #343434;}
 
/************** process section *********************/
.p_bold {font-weight: 700; font-size: 17px; }
section#process { background-color: #fff; background-position: center; background-repeat: no-repeat;min-width:1200px;}
section#process>.container { height: 40vh; position: relative; padding:0; } 
section#process .container .section-heading {position: absolute; top: 17.4vh; left: 50%; margin-left: -187px; display: inline-block; 
width: 374px; height: 71px; text-indent: -9999em; color: #fff; overflow: hidden; background: url('/images/subscribe_title.png'); }
section#process .section-subheading {width: 100%; text-align: center; font-size: 25px; position: absolute; top: 30vh;  letter-spacing: -0.06em; font-weight: 300; }

section#process .bg { background: url('/images/contact_bg.jpg') no-repeat; background-size: cover;  }
section#process .contact-mid .container { padding: 3% 0;  }
section#process .contact-mid .container .contact-icon { position: relative; width: 25%; height: 27vh; color: #fff; text-align: center; background: url('/images/cir.png')no-repeat; 
background-size: contain; background-position-x: center;}
section#process .contact-mid .container .contact-icon i { font-size: 50px; position: absolute; top: 29%; left: 50%; display: block;  }
section#process .contact-mid .container .contact-icon p {font-size: 18px; line-height: 1.3;  letter-spacing: -0.04em; position: absolute; top: 55%; text-align: center; width: 100%;}
section#process .contact-mid .container .contact-icon .icon_p { letter-spacing: -0.1em;}

section#process .contact-mid .container .contact-icon:nth-child(1) i { margin-left: -21px;}
section#process .contact-mid .container .contact-icon:nth-child(2) i {margin-left: -25px;}
section#process .contact-mid .container .contact-icon:nth-child(3) i {margin-left: -32px;}
section#process .contact-mid .container .contact-icon:nth-child(4)  i {margin-left: -29px;}

section#process .cont_form {width: 510px; float: right; }
section#process .cont_form p { font-size: 21px; font-family: 'Noto Sans KR'; line-height: 1.4; margin:0;  letter-spacing: -0.02em; }
section#process .contact-msg {background-color: rgba(0,0,0,.3); color: #fff; padding: 4% 0;}
section#process .contact-msg .container {}
section#process .contact-msg .container .phone {font-size: 39px; line-height: 1.4em; }
section#process .contact-msg .container .k_store {margin-top: 30px; float: left;  }
section#process .contact-msg .container .k_store ul li {float:left;}
section#process .contact-msg .container .k_store ul li p {margin-bottom:0; font-size: 13px; line-height: 19px;  letter-spacing: -0.02em; text-decoration: none; }
section#process .contact-msg .container .k_store ul li:nth-child(2) {margin-right: 67px; margin-left: 67px; }
section#process .contact-msg .container .g_store {clear: both; padding-top: 50px; float: left; }
section#process .contact-msg .container .g_store ul li {float: left; text-align: center; margin-right: 17px;  }
section#process .contact-msg .container .g_store ul li p {margin: 10px auto; }

section#process #subscribeForm {margin-top: 50px;}
section#process #subscribeForm .c_form { float: left; width: 60%; }
section#process #subscribeForm .c_form input{ height: auto; width: 171px;	background: transparent;	border: none; box-shadow: none;
    border-bottom: 1px solid #fff; border-radius: 0; color: #eee; }
section#process #subscribeForm .left_input { width: 40%; }
section#process #subscribeForm .left_input  input {width: 101px;}
section#process label{text-align: left; padding-top: 8px; margin-bottom:0; font-size: 17px; margin-right: 40px;  letter-spacing: -0.02em;  }
section#process textarea { width: 510px; height: 116px; background: #a41724;}


section#process label[for=smessage] {margin-top: 20px; margin-bottom:5px; font-size: 17px; }
section#process textarea { height: 140px; background: rgba(255,255,255,.3); border: none; box-shadow: none; resize: none; color: #eee; }
input:focus, textarea:focus {outline: none !important; }

section#process .form-control:focus { border-color: #bc1f2d; box-shadow: none;}
section#process ::-webkit-input-placeholder { color: #eeeeee; }
section#process :-moz-placeholder {  /* Firefox 18- */ color: #eeeeee; }
section#process ::-moz-placeholder {  /* Firefox 19+ */ color: #eeeeee; }
section#process :-ms-input-placeholder { color: #eeeeee; }
section#process .text-danger { color: #e74c3c; }
section#process .contact-btn { border-color:#fff; background-color: #fff; border-radius:0; font-weight: 700;  letter-spacing: -0.02em;
  font-size: 18px; line-height: 50px; transition: all .3s; margin: 30px 0 0; color:#252525; width: 210px; height: 50px; }
section#process .contact-btn:hover, 
.contact-btn:focus, .contact-btn:active, .contact-btn.active {
  color: white; background-color: #343434; border-color: #343434;}


/*  
section#contact .bg #process {}
section#contact .bg #process .container { width: 1286px; margin: 0 auto; padding: 80px 0 100px; text-align: center;  }
section#contact .bg #process .container h3 { color: #fff; font-size: 38px; margin-bottom: 70px; display: inline-block; border-bottom: 2px solid #fff; line-height: 1.5;   }
section#contact .bg #process .container .pro_step {position: relative; width: 80%; margin-left: 10%;   }
section#contact .bg #process .container .pro_step img { width: 100%; }
section#contact .bg #process .container .pro_step p {color: #fff; font-size: 24px; position: absolute; top: 37%; line-height: 1.5; }
section#contact .bg #process .container .pro_step .step1 { left: 10%;top:23%; }
section#contact .bg #process .container .pro_step .step2 { left: 34%; top: 23%; }
section#contact .bg #process .container .pro_step .step3 { left: 59%;}
section#contact .bg #process .container .pro_step .step4 { left: 84%;}
*/

 /*
 
@media screen and (max-width:1285px) {
	section#contact .container {width: 90%; margin-left: 5%;}
	section#contact .contact-mid .container .contact-icon p { font-size: 19px; }
	section#contact .container .section-heading { width: 337px; height:64px; background-size: cover; margin-left: -168px; }
	section#contact .bg #process .container { width: 90%; }
	section#contact .bg #process .container .pro_step { }
	section#contact .bg #process .container .pro_step p {font-size: 22px; top: 35%;}
}
*/
@media screen and (max-width:1285px) {
	section#contact .container {width: 90%; margin-left: 5%;}
	section#contact .contact-mid .container .contact-icon p { font-size: 19px; }
	section#contact .container .section-heading { width: 337px; height:64px; background-size: cover; margin-left: -168px; }
	section#process .container {width: 90%; margin-left: 5%;}
	section#process .contact-mid .container .contact-icon p { font-size: 19px; }
	section#process .container .section-heading { width: 337px; height:64px; background-size: cover; margin-left: -168px; }

}


	


/*************** Google Map ***************/
aside #map {
	width: 100%;
	height: 50vh;
}
@media screen and (max-width:1285px) {
	aside #map { }
}
@media screen and (max-width:1024px) {
	aside #map {  }
}
@media screen and (max-width:768px) {
	aside #map {height: 30vh;}
}



/*************** Footer  ***************/
footer { height: 188px; text-align: center; background-color: #2f2f2f; color: #fff; padding-top: 40px; padding-bottom: 60px; }
footer .container {width: 1286px; }
footer .container .footer_logo {width:312px; text-align: left; float: left; margin:0; padding:0; }
footer .container .copyright {  float: left; line-height: 85px;  font-size: 15px; text-transform: none; color: #fff;  letter-spacing: 0; }
footer .container .addr {float: right; font-size: 13px; line-height: 19px; margin-top: 10px; padding-left: 80px; }
footer .container .addr p { text-align: left; 	line-height: 1.2em; font-size: 13px;  letter-spacing: 0; }
@media screen and (max-width:1285px) {
	footer { height: 169px; padding-top: 36px; padding-bottom: 54px; }
	footer .container {width: 90%; }
	footer .container .footer_logo { width: 230px; }
}














/*************** Now Play Modal  ***************/
.btn:focus,
.btn:active,
.btn.active,
.btn:active:focus {
  outline: none;
}
.portfolio-modal .modal-dialog {
  margin: 0;
  height: 100%;
  width: auto;
}
.portfolio-modal .modal-content {
  border-radius: 0;
  background-clip: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none;
  min-height: 100%;
  padding: 100px 0;
  text-align: center;
}
.portfolio-modal .modal-content h2 {
  margin-bottom: 15px;
  font-size: 3em;
}
.portfolio-modal .modal-content p {
  margin-bottom: 30px;
}
.portfolio-modal .modal-content p.item-intro {
  margin: 20px 0 30px;
  font-size: 16px;
}
.portfolio-modal .modal-content ul.list-inline {
  margin-bottom: 30px;
  margin-top: 0;
}
.portfolio-modal .modal-content img {
  margin-bottom: 30px;
}
.portfolio-modal .close-modal {
  position: absolute;
  width: 75px;
  height: 75px;
  background-color: transparent;
  top: 25px;
  right: 25px;
  cursor: pointer;
}
.portfolio-modal .close-modal:hover {
  opacity: 0.3;
}
.portfolio-modal .close-modal .lr {
  height: 75px;
  width: 1px;
  margin-left: 35px;
  background-color: #222222;
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  /* IE 9 */
  -webkit-transform: rotate(45deg);
  /* Safari and Chrome */
  z-index: 1051;
}
.portfolio-modal .close-modal .lr .rl {
  height: 75px;
  width: 1px;
  background-color: #222222;
  transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  /* IE 9 */
  -webkit-transform: rotate(90deg);
  /* Safari and Chrome */
  z-index: 1052;
}
.portfolio-modal .modal-backdrop {
  opacity: 0;
  display: none;
}
::-moz-selection {
  text-shadow: none;
  background: rgba(188,31,45,.5);
}
::selection {
  text-shadow: none;
  background: rgba(188,31,45,.5);
}
img::selection {
  background: transparent;
}
img::-moz-selection {
  background: transparent;
}
body {
  webkit-tap-highlight-color: rgba(188,31,45,.5);
}