@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600');
@import 'https://fonts.googleapis.com/css?family=Lato';
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
/*나눔스퀘어 굵기정의(17px 이상 사용권장)
Light font-weight:300;
Regular font-weight:400;
Bold font-weight:700;
Extra Bold font-weight:800;
*/

@font-face {
  font-family: 'GongGothicBold';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'GongGothicMedium';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}



/*-- 메인컬러 --*/

body{font-family: 'NanumSquare', sans-serif;}

h1, h2, h3, b, p, span{
  margin:0;
  padding:0;
  transform: skew(-0.001deg);  
  word-break: keep-all;
}  
  a {
  text-decoration: none;
  color: #f9f9f9;
}
a:hover {
  text-decoration: none;
  color: #f9f9f9;
}

.blue {
	color: #09F;
}

.green {
	color: #0A0;
}

h1,h2{
  font-family: 'GongGothicBold';
}

span, p, b, td {  
  font-weight: 400;
  font-size: 20px;
  color: #fff;  
}

/*h1*/
.headline {  
  font-size: 60px;
  color: #fff;
  margin-bottom: 20px;
}

.headline:first-letter{
  color:#EC1E24;
}

*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }


/*diagon overlay*/
.diagon-red {
  position: absolute;    
  top: 0;
  left: 44.3%;
  width: 975px;
  height: 100%;
  background-color: #EC1E24;
  filter: opacity(0.5);
  transform: skewx(-35deg);
  mix-blend-mode: overlay;
  pointer-events: none;
}

.diagon-blue {
  position: absolute;    
  top: 0;
  left: 44.3%;
  width: 975px;
  height: 100%;
  background: #518DBD;
  filter: opacity(0.5);
  transform: skewx(-35deg);
  mix-blend-mode: overlay; 
  pointer-events: none; 
}

.diagon-filpred {
  position: absolute;    
  top: 0;
  left: 51.8%;  
  width: 975px;
  height: 100%;  
  background-color: #EC1E24;
  filter: opacity(0.5);
  transform: skewx(35deg);
    mix-blend-mode: overlay;
    pointer-events: none;  
}

#about .abred01{
  top:-50%;  
}

#about .abred02 {
  left: 20%;
  transform: skewx(35deg);
}

#about .abred03 {
  left: 230%;
}

#about .abblue01{  
  left: -70%;
}

#about .abblue02 {
  transform: skewx(35deg);
  left: -107%;
}

#contact .diagon-blue {
  left: 10%;
}


/*main(media) style*/
#first .main-slogan b{font-size:35px; font-weight:700;}
#first .main-slogan p{font-size:29px;margin-bottom: 45px;}

#first .stat-head p{font-size:25px; font-weight: 700; margin-bottom: 20px;}
#first .stat-table {display: flex}
#first .stat-table p{margin-bottom: 20px}
#first .stat-table .stats{  
  width: 180px;
  height: 145px;  
  margin-right: 15px;
  border-radius: 5px;
  background-color: rgba(255,255,255,0.2);
  text-align: center;  
}

#first .stat-table .stats p{
  font-size: 23px;
  margin-top: 18%;
  margin-bottom: -4px;
}
#first .stat-table .stats b{
  font-size: 45px;
  font-weight: 800;  
}

.main-img{text-align:center;}

#total-intro p{
  font-size:25px
}


/*about style*/

#about-top .vid-text h2{
  margin:30px 0;
  text-align: center;
  font-size: 45px;
  color: #fff;  
}

#about-top .vid-text .text-overlap{
  color:rgba(255,255,255,.5);
  mix-blend-mode: overlay;
}

#about-top br{display: none;}

#about-com .company{
  -webkit-filter:drop-shadow(5px 5px 2px rgba(0,0,0,0.3));
  filter:drop-shadow(5px 5px 2px rgba(0,0,0,0.3));
}

#about-us h1{  
  margin-bottom: 120px;
}

#about-us b{
  color:#262661
}

#about-us .vision{
  left:6.8%;
}

#about-us b{
  font-family: 'GongGothicBold';
  font-size:35px;  
}

#about-us hr{
  margin-top: 10px;
  margin-bottom: 30px;
  width:70%;  
  text-align:left;
  border: solid 1px #fff;  
}

#about-us p {
  font-family: 'NanumSquare', sans-serif;
  font-size: 25px;
  margin-bottom: 100px;
}

#about-service h1{  
  margin-bottom: 90px;
}

#about-service h2{
  font-size:60px;    
  color:rgba(50, 197, 255, 0.8);
  margin-bottom: 30px;
}

#about-service p {
  font-size: 25px;
  margin-bottom: 50px;
}

#about-dif h1{  
  margin-bottom: 120px;
}

.dif-item, .flow-item, .pro-item{text-align: center;}

#about-dif img:last-of-type,
#about-com img:last-of-type,
#about-flow img:last-of-type,
#about-promise > .container img:last-of-type,
.dif-item img:last-of-type,
#about-pic img:last-of-type{
  display: none;
}

#about-dif img:first-of-type,
#about-com img:first-of-type,
#about-flow img:first-of-type,
#about-promise > .container img:first-of-type,
#about-pic img:first-of-type
{
  display: inline-block;
}

#about-flow h1{  
  margin-bottom: 120px;
}

#about-promise h1{  
  margin-bottom: 120px;
}

/*design*/

#design .container{
  column-count: 3;  
}

.design-item{
  margin-bottom: 10px;
  overflow: hidden;
}

.design-item img{  
  width: 100%;
  transition: 0.25s ease-in-out;
}

.design-item a{
  display: inline-block;
}

.item-overlay{  
  position: absolute;
  transition: all 0.3s ease-in-out;
  opacity: 0;
  background: rgba(236,30,36, 0.9);    
}

.design-item:hover .item-overlay{
  opacity: 1;  
}

.overtop{
  width: 100%;
  height:0;
  bottom:0;
  left:0;
}

.design-item:hover .overtop{
  height: 100%;
}

.item-name{
  position: absolute;
  text-align: center;      
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  font-family: 'GongGothicMedium';
  font-size:22px;
  word-break: keep-all;
}


/*contact style*/
#contact .slogan-m{
  font-family:'GongGothicBold';
  font-size:60px; 
  color:rgba(80,82,214,.7);
  z-index: 0;
}

#contact .slogan-b{
  font-family:'GongGothicBold';
  font-size:60px; 
  line-height: 60px;    
  color:#fff;
}

#contact .headline{
  margin-bottom: 60px;
}

#contact-slogan p{
  margin-top: 35px;
}

#contact-slogan span:not(.icon-bar){  
  color:#EC1E24;
  font-size:60px;
}

.blz-info b{
  font-family: 'GongGothicMedium';
  font-size:30px;
  color:#fff;  
}

.blz-info p{  
  font-size: 20px;
  margin-bottom: 60px;
}

/*-- Side Bar --*/

.side-bar h4 {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  background-color: #f78e21;
  margin-top: 0px;
  padding: 9px 15px 9px 15px;
}

.archives-list ul {
  margin-top: 25px !important;
  padding-bottom: 30px !important;
  margin: 0;
  padding: 0;
}

.archives-list li {
  list-style: none;
  margin: 10px 0;
}

.archives-list i {
  font-size: 16px;
  margin-right: 5px;
  color: #f78e21;
}

.archives-list a {
  text-transform: uppercase;
  color: #888;
  font-size: 13px;
}

.archives-list a:hover {
  color: #f78e21;
}

.recent-post {
  overflow: hidden;
  margin-bottom: 20px;
}

.recent-post-thumb {
  float: left;
  margin-right: 20px !important; 
  width: 70px;
  height: 70px;
}

.recent-post-info {
  overflow: hidden;
}

.recent-post-info h6 {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  margin-top: 0;
}

.posts {
  margin-top: 30px;
  margin-bottom: 30px;
}

.recent-post-info a {
  color: #333;
}

.recent-post-info a:hover {
  color: #f78e21;
}

.recent-post-info span {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  color: #f78e21;
}

.flickr-images {
  margin-top: 20px;
}

.flickr-images img {
  margin-top: 20px;
  overflow: hidden !important;
  width: 68px;
}

.flickr-images img:hover {
  border: 3px solid #f78e21;
  transition: all 0.1s ease-in;
  cursor: pointer;
}

/*-- End Side Bar --*/





/*-- Slider --*/

#slider {
  overflow: hidden;
}

.slider-caption {
  text-align: center;
  position: absolute;
  width: 100%;
  margin-top: 160px;
  color: #fff;
  font-family: 'Open Sans', sans-serif;
}

.slider-caption h1 {
  font-size: 70px;
  padding-bottom: 10px;
  font-weight: 400;
  color: #fff;
  text-transform: uppercase;
}

.slider-caption p {
  font-size: 18px;
  font-weight: 300;
  color: #fff;
  line-height: 25px;
  margin:10px auto;
}

.slider-caption a {
  margin-top: 30px;
  text-decoration: none;
  display: inline-block;
  background-color: #f78e21;
  width: 200px;
  height: 40px;
  text-align: center;
  color: #fff;
  line-height: 40px;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 600;
}

/*-- End Slider --*/

/*-- Latest Posts --*/

.blog-post {
  
  margin-bottom: 5px; 
}

.blog-post

.blog-thumb {
  overflow: hidden;
  position: relative;
}

.blog-thumb img {
  width: 100%;
}

.blog-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(130,130,130, 0.7);  
  padding: 10px;
  font-family: 'Nanumsquare';
  font-weight: 400;
}

.content-show h4 {
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
}

.content-hide {
  display: none;
}

.content-hide p {
  color: #fff;
  font-size:17px;
}

/*-- End Latest Posts --*/

/*formmail style*/

input, textarea {
  padding: 10px;
  border: none;
  font-size: 17px !important;
  font-weight: 300;
  outline: none; 
  resize:none;
}

textarea {
  min-height: 165px;
  max-height: 180px;  
  /*max-width: 661px;*/
  line-height: 18px;
  width: 100%;
  background:#2a2b71;
}

.table_02{font-family: inherit;
  border: 0 !important; 
}
.table_02 td{padding-bottom:13px;border: 0 !important;}
.table_02 font{
  display: none;  
  font-size:0px;
}

.table_02 input[type="file"]{
  font-family: "Nanumsquare";
  font-size: 17px;
}
.table_02 textarea{font-size: 17px !important;line-height: 23px;}



.formmail_title_bgcolor {display: none;font-size:0;}
.formmail_cell_bgcolor {background-color: rgba( 255, 255, 255, 0 )!important; width:80%;padding:0 10px;font-family: "Nanumsquare"!important;font-size: 0;}
.formmail_cell_bgcolor tr{background: #2a2b71;}
.formmail_cell_bgcolor tr:first-child{border-bottom: 2px solid #ec1e24;}
.formmail_cell_bgcolor td{padding:10px;}
.formmail_cell_bgcolor td:nth-child(2){font-size:0;}
.formmail_cell_bgcolor td:nth-last-child(2){font-size: 0px;}
.formmail_cell_bgcolor td:nth-child(2)::after{content:'동의합니다';font-size:18px;padding-left:10px;}
.formmail_cell_bgcolor td:nth-last-child(2)::before{content:'개인정보의 수집 및 이용목적';font-size:18px;}
.formmail_border {width:100%; height:55px;border:none; background:#2a2b71;float:left;color: #fff !important;font-family:"Nanumsquare"!important;}

.formmail_textarea_style {color:#eee; width:100%;}

#send-btn{
  padding-top:10px;
  cursor: pointer;
}

#send-btn .headline{  
  display: inline-block;
  font-size: 50px;  
}

#send-btn .headline:hover{  
  color:#ec1e24;
  
}

#send-btn img{
  transform: translate(27%, -27%);}


/*--Footer--*/

footer {text-align:center;
  background-color: #1E214C;
  margin-top: 0px; 
  z-index: 1;
}

.bottom-footer {
  padding: 30px 0 15px 0;
}

.bottom-footer p{ font-family: 'Nanumsquare'; color:rgba(255,255,255,0.5);line-height:25px; text-align:center; font-size: 17px; font-weight:400;}
.bottom-footer span {font-family: 'Nanumsquare'; color: #fff;font-size: 17px;}
/*-- End Footer --*/

/*갤러리 필터*/
.gallery-title {
  font-size: 36px;
  color: #FFA500;
  text-align: center;
  font-weight: 500;
  margin-bottom: 70px
}

.gallery-title:after {
  content: "";
  position: absolute;
  width: 22.5%;
  left: 38.5%;
  height: 45px;
  border-bottom: 1px solid #5e5e5e
}

.filter-button {
  font-size: 18px;
  border: 1px solid #ec1e24;
  border-radius: 5px;
  text-align: center;
  color: #ec1e24;
  margin-bottom: 15px;
  background: #fff;
}

.filter-button:hover {
  font-size: 18px;
  border: 1px solid #123266;
  border-radius: 5px;
  text-align: center;
  color: #ffffff;
  background-color: #123266
}

.btn-default:active .filter-button:active {
  background-color: #123266;
  color: #123266
}

.port-image {
  width: 100%
}

.gallery_product {
  margin-bottom: 30px
}



/*--- RESPONSIVE ---*/
@media screen and (min-width: 1440px){
  /*.container{
    width: 1300px;
  }*/

  #total-media .container{
    margin-top: 150px;
    margin-bottom: 150px;
  }

  #about-service h2{font-size: 50px;}
}

@media screen and (max-width:1440px) {
  .container{width:1250px}
  
}

@media screen and (max-width: 990px) {
#intro {text-align:center; overflow:hidden; width:100%; height:600px; position:relative;}
.company .photo {width:100%; text-align:center; margin-top:30px; text-align:center;}
  .home-account {
    text-align: center;
    display: block;
  }

  .cart-info {
    text-align: center;
    display: block;
  }
  
  .logo {
    text-align: center;
  }

  .search-box {
    display: none;
  }

  .slider-caption {
    display: none;
  }

  .service-item {
    margin-top: 40px;
  }

  .footer-title {
    margin-top: 60px;
  }

  .bottom-footer {
    text-align: center;
  }

  .timeline-thumb{
    margin-top: 30px;
    border-bottom: none;
  }

  .team-thumb {
    margin-top: 30px;
  }

  .side-bar {
    margin-top: 100px;
  }

  .side-bar h4 {
    width: 100%;
  }

  .send-message input {
    margin-top: 20px;
  }

  .info:not(.filter) {
    margin-top: 60px;
    text-align: center;
  }
  .board_list td img {width:100%; height:auto !important;}
   
.board_view #post_area img {width:100% !important; height:auto !important; padding:0; margin:0;}
}

@media all and (max-width: 1024px){
  
  #first .stat-table .stats{
    height:100px;
  }

  #first .stat-table .stats p {
    font-size: 15px;
    margin-top: 15%;
    }
  #first .stat-table .stats b {font-size: 35px;}
  .main-img img{width: 430px;}

  .mred2{left: 47.8%;}
  

  #about .mred1{left: 43.5%;}
  #about .mred2{left: 88.6%;}
  #about.abred01{top: -56%;}
  #about .abred02{left:-30%}
  #about .abred03{left: 280%;}
  #about.abblue01{left: -60%;}
  #about .abblue02{left:-175%}
      
  .headline:not(#main .headline) {margin-bottom: 65px; font-size: 50px;}
  #about h2{font-size: 40px; margin-bottom: 10px;}
  #about p:not(.phone p) {font-size: 16px;margin-bottom: 80px;}
  
  #about-top .vid-text h2{font-size: 39px;margin-bottom: 0px;text-align: left;left: 13%;}
  #about-top br{display: inline;}
  

    #about-us{
      height:auto;
    }

    #about-us b{
      font-size: 25px;
    }

    #about-promise .pro-bg{
      height:630px !important;
   }
    #about-promise .container{
      top:0;
      width:auto;
    }  

    #contact .slogan-m{font-size: 47px;}
    .blz-info b {font-size: 24px;}
    .blz-info p {
      font-size: 16px;
  }
  .information p{font-size: 0px}
  .information p:after{
    content:'본사) 고양시 일산동구 장항동 742-1\A지사) 서울시 강남구 논현동 197-19\ATel : 031.819.0210\A Fax : 031.819.0220';
    white-space: pre;
    font-size: 16px;}
  
  .field p{font-size: 0px;}
  .field p:after{
    content:'PROMOTION\A 3D / GAME MEDIA\AINFOGRAPHIC\AGRAPHIC DESIGN';
    white-space: pre;
    font-size: 16px;}

}

@media all and (max-width:1001px){
  .blz-info b {font-size: 20px;}
  .blz-info p{margin-top:6px;}
  .ceo p, .information p::after, .field p::after{font-size: 15px;}
}

@media all and (max-width: 991px){
  #first .stat-table .stats{width: 128px;}
  #first .main-slogan b{font-size:35px; font-weight:700;}
  #first .main-slogan p{font-size:29px;}  
  .main-img img{width: 500px;}  

  #contact .slogan-b{font-size: 45px; line-height: 50px;}
  #contact .slogan-m{font-size: 34px;}
  #contact-slogan p{margin-top: 20px;}
  #contact-slogan span:not(.icon-bar){font-size: 45px;}
  .ceo p, .information p::after, .field p::after {
  font-size: 14px;
}



  .table_02 td{padding: 5px 0 !important; }
  .table_02 textarea{max-width: none;}
  
}

/* 텍스트 겹침 해결
@media all and (max-width: 821px){
  .blz-info b{font-size:18px;}
  .blz-info p{margin-top:2px;}
  .ceo{left:10px;}
  .ceo p, .information p::after, .field p::after {
    font-size: 13px;
  }
}*/

@media all and (max-width: 768px){
  
.headline{font-size: 45px}
#first .main-slogan span{font-size:17px;}
#first .main-slogan p{margin-bottom: 25px;}
#first .stat-head p{font-size:20px}
#first .stat-table .stats{
  width:125px;
  height:110px;
}
#first .stat-table .stats b{font-size: 35px;}
#first .stat-table .stats p{font-size: 18px;}

.main-img{margin-top: 50px;}

.diagon-blue,
.diagon-filpred,
.diagon-red{
  width: 660px;
}
#about .mred1{left: 43.5%;}
#about .mred2{left: 88.6%;}
#about.abred01{top: -56%;}
#about .abred02{left:-17%}
#about .abred03{left: 290%;}
#about.abblue01{left:-92%}

#about .headline {margin-bottom: 60px;}
#about p:not(.phone p) {font-size: 16px;}


#about-promise .container{
  width:auto;  
}


#about-top .container{margin-top:40px;}
#about-top .vid-text h2{font-size: 30px;}

#about-com img{vertical-align: middle;}
#about-us .vision {
  left: 0;  
}

#about-us hr {
  margin-bottom: 20px;
  width: 85%;
}


#about-us p {margin-bottom: 55px;}
#about-service h2{margin-bottom: 15px;font-size:28px;}

#about-promise .container{top:0;}
#about-promise .pro-bg{height:545px !important;}
#about-promise .headline {
  margin-bottom: 55px;
}


#design .container{column-count: 2;}
.item-name{font-size: 20px;}

#contact .cblue {left: -16%; top: -7.5%;}
#contact .headline{margin-bottom: 35px}
#contact-slogan .slogan-m{font-size: 30px; line-height:35px;word-break: keep-all;}
#contact-slogan .slogan-b{font-size: 35px;}
#contact-slogan p{font-size: 15px; margin-top:6px;}
#contact-slogan span:not(.icon-bar){font-size:35px;}

   #contact-form {top: 5px}
   .table_02{margin-top: 10px}
   .table_02 tr:last-child > .formmail_cell_bgcolor{padding: 0 !important}
   .formmail_cell_bgcolor {width: 100%;padding: 0;}   
   .formmail_textarea_style{max-width: 684px}
  
   #send-btn {padding-top: 20px}
   #send-btn .headline{font-size: 40px}
   #send-btn img{width: 35px}

   footer p,
   footer span{line-height: 20px;}
   .bottom-footer p,
   .bottom-footer span{font-size:15px;}

   #contact footer .container{margin-top: 0;}  
}

@media all and (max-width: 766px){

  #contact-us .blz-infobox2{
    text-align:center;
  }

}

@media all and (max-width: 720px) { 
 .intro .carousel-caption {bottom:25%;}
 .intro .carousel-caption p {display:none;}
 .intro .carousel-caption h1 { font-family:'nanum gothic','malgun gothic'; font-size:35px; font-weight:700; margin-top:0; padding:0 50px;
}
}

@media all and (min-width: 641px) {
.bottom .icon {display:none;}
}
@media all and (max-width: 640px) {

 #contents .blog-post img {width:100%;}

 .heading-section h2 {
  font-size: 30px;
  text-transform: uppercase;
}
 .heading-section h3 {
  font-size: 30px;
  text-transform: uppercase;
}
 #heading {height:90px;}
  #heading h2 {
  font-size: 30px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
}
#heading .heading-content h2.black{color:#000!important;}

.heading-content {
  text-align: center;
  margin-top: 30px;
}
.heading-section { 
  text-align: center;
  padding:30px 0;
}
.heading-section .title{padding:20px 0;}

.bottom  {margin-bottom:40px; text-align:center;}
.bottom .icon a {margin:10px;}

}
@media screen and (max-width: 568px) {

 .intro .carousel-caption {bottom:23%;}
 .intro .carousel-caption p {display:none;}
 .intro .carousel-caption h1 { font-family:'nanum gothic','malgun gothic'; font-size:30px; font-weight:700; margin-top:0; padding:0 50px;}
  .intro .carousel-indicators {display:none;}
 
  .home-account {
    text-align: center;
    display: block;
  }

  .cart-info {
    text-align: center;
    display: block;
  }
  
  .logo {
    text-align: center;
  }

  .search-box {
    display: none;
  }

  .content-hide p {
    display: none;
  }

  .slider-caption {
    display: none;
  }

  .service-item {
    margin-top: 40px;
  }

  .footer-title {
    margin-top: 60px;
  }

  .bottom-footer {
    text-align: center;    
  }

  .timeline-thumb{
    margin-top: 30px;
    border-bottom: none;
  }

  .team-thumb {
    margin-top: 30px;
  }

  .side-bar {
    margin-top: 100px;
  }

  .side-bar h4 {
    width: 100%;
  }

  .send-message input {
    margin-top: 20px;
  }

  .info:not(.filter) {
    margin-top: 60px;
    text-align: center;
  }

  .logo {
    padding-bottom: 60px;
  }

  .main-menu li {
    display: block;
    margin-top: -60px;
    margin-right: 0px;
  }

  #heading-section img {
    display: none;
  }

  .divide-line img {
    display: none;
  }

  .top-footer {
    display: none;
  }

}

@media all and (max-width: 425px){

.headline{font-size: 30px; margin-bottom: 10px;}
.headline:not(#main .headline){font-size: 30px; margin-bottom:30px;}
.diagon-blue,.diagon-filpred,.diagon-red{width: 300px;}

#first {height:670px;}
#first .main-slogan span{font-size:15px;}
#first .main-slogan p{margin-bottom: 10px;}
#first .stat-head p{font-size:15px}
#first .stat-table .stats{
  width:76px;
  height:70px;
}
#first .stat-table .stats b{font-size: 20px;}
#first .stat-table .stats p{font-size: 13px;}

.main-img {  
  left: 0;
  margin-top: 16px;
}
.main-img img{width: 250px;}

.mred1{left: 43.5%;}
.mred2{left: 278.6%;}

#total-media p{font-size: 18px;}
#total-media .works {
  margin-top: 45px;
}

#about .headline{font-size: 30px;margin-bottom: 50px;}
#about p:not(.phone p) {font-size: 14px;margin-bottom: 50px;}
#about-com{height:440px;}
#about-top .vid-text h2,
#about-us b {font-size: 20px;}
#about-top .vid-text h2{left:5%}
#about-us .vision {
  left: 8%;
}
#about-service, #about-dif, #about-flow {height: auto;}
#about-service h2 {margin-bottom: 10px; font-size: 20px;}
#about-service .service-set01,
#about-service .service-set02,
#about-service .service-set03,
#about-service .service-set04,
#about-service .service-set05,
#about-us .vision{
  left:8%;
}

#about-dif img:last-of-type,
#about-com img:last-of-type,
#about-flow img:last-of-type,
#about-promise > .container img:last-of-type,
.dif-item img:last-of-type,
#about-pic img:last-of-type{
  display: inline-block;
}

#about-dif img:first-of-type,
#about-com img:first-of-type,
#about-flow img:first-of-type,
#about-promise > .container img:first-of-type,
#about-pic img:first-of-type
{
  display: none;
}

#about-promise .pro-bg{  
  height:545px !important;
  overflow: hidden;
  max-width: max-content;  
}

#design .container{column-count: 1;}

  #contact .diagon-blue {left: -16%}
  #contact .headline{margin-bottom: 35px}
  #contact-slogan {height: 430px;}
  #contact-slogan .slogan-m{font-size: 0px;}
  #contact-slogan .slogan-m::after {
    content: '새로운 시도와 도전을\A주저하지 않는 것';
    white-space: pre;
    font-size: 25px;
    line-height: 15px;}
  #contact-slogan span:not(.icon-bar){
    font-size: 25px;
    }
  #contact-slogan .slogan-b{font-size: 25px; margin-top:-10px;}
  #contact-slogan p{font-size: 14px; margin-top:6px;}

  .blend .blz-info {
    margin-bottom: -25px;
}
  .blz-info b{font-size:20px}  
  
   #contact-form {top: 5px}
   #contact-form iframe{width:100%;margin-top:10px; width:100%;}
   .table_02{margin-top: 10px}
   .table_02 tr:last-child > .formmail_cell_bgcolor{padding: 0 !important}
   .formmail_cell_bgcolor {width: 100%;padding: 0;}   
   .formmail_textarea_style{max-width: 684px}
  
   #send-btn {padding-top: 20px}
   #send-btn .headline{font-size: 40px}
   #send-btn img{width: 35px}

   /*
   .bottom-footer p:first-child,.bottom-footer span{font-size: 0px;}
   .bottom-footer p:first-child::after {
    content:'(주)블레이즈미디어웍스\A사업자등록번호 : 352-81-01404 대표자 : 이서진';
    white-space: pre;
    font-size:15px;line-height: 22px;}
    .bottom-footer::after {
      color: #fff;
      content:'010.4169.0210 / 031.819.0220\Asystem210@naver.com\A Copyright ⓒ 2020 BLAZE All Rights Reserved.';
      white-space: pre;
      font-size:15px;line-height: 22px;}*/

      #send-btn .headline {
        font-size: 30px;
    }
    #send-btn img {
      width: 25px;
  }
  #send-btn img {
    transform: translate(27%, -20%);
  }

  #contact footer .container{margin:0 40px;}
    

}

@media all and (max-width: 375px){

  #first .main-slogan b {font-size: 30px;}
  #first .main-slogan p {font-size: 25px;}
  #total-media p {font-size: 15px;}  
  #first .stat-table .stats{
    width:67px;
    height:65px;
    margin-right: 10px;
  }

  #about .headline{margin-bottom: 40px; font-size: 25px;}
  #about-com {height: auto;}
  #about-us p {margin-bottom: 35px;}
  #about-promise .pro-bg {
    height: 485px !important;
  }
  
  #contact-slogan {
    height: 400px;
  }
#contact-slogan .slogan-m{line-height: 25px;}
#contact-slogan .slogan-m::after, #contact-slogan .slogan-b {font-size: 25px;}
#contact-slogan .slogan-b{margin-top:-15px;}
#contact-slogan .slogan-m span {margin-top: 5px;}

}

@media all and (max-width: 320px){

  .headline {font-size: 25px;}
  .diagon-blue, .diagon-filpred, .diagon-red {width: 200px;}

  
    #first .stat-table .stats{
      width:60px;
      height:60px;
      margin-right: 5px;
    }
  
    #first .stat-table .stats p{
      font-size:12px;
    }

    #first .main-slogan b{font-size: 25px;}
    #first .main-slogan p {font-size: 21px;}
    #total-media p {font-size: 12px;}

    #about-service .service-set01,
    #about-service .service-set02,
    #about-service .service-set03,
    #about-service .service-set04,
    #about-service .service-set05,
    #about-us .vision{
      left:0;
      }
    
    #about-service .service-set05 p{margin-bottom:20px;}
    #about-promise .pro-bg {height: 430px !important;}
    

    #about .abred01 {top: -48%;}
    #about .abblue01 {left: -120%;}
    #about .abred02 {left: 5%;}
    #about .abblue02 {left: -345%;}
    #about .abred03 {left: 511%;}

    #contact-slogan {height: 330px;}
    #contact-slogan .slogan-m::after, #contact-slogan .slogan-b,  #contact-slogan .slogan-b {font-size: 20px;}
    #contact-slogan .slogan-m {line-height: 20px;}
    #contact .slogan-b{line-height: 55px;}
    #contact-slogan span:not(.icon-bar){font-size: 20px;}
    #contact-us .blz-infobox2 {margin: 15px;}
    .blz-info b {font-size: 17px;} 



}

@media screen and (max-width: 1000px) {

  .slider-caption {
    display: none;
  }
}

@media screen and (max-width: 600px) {



  body {
    overflow-x: hidden;
  }

}

@media screen and (min-width: 995px) {

  .hover-iner span {
  margin-top: 160px;
  }

  body {
    overflow-x: hidden;
  }
}

/*--- END RESPONSIVE ---*/