@CHARSET "UTF-8";
	

@media (max-width: 1810px) {
	.main_top .right ul { width: 810px; }
	
	
}
@media (max-width: 1710px) {
	.main_top .right ul {  width: 710px; 
}
@media (max-width: 1610px) {
	.main_top .right ul {  width: 710px; 
}

@media (max-width: 1510px) {
	.main_top .right ul {  width: 610px; 
}

@media (max-width: 1310px) {
	  .main_top .flickity-prev-next-button.previous { left: -120px; top: 225px; }
     .main_top .flickity-prev-next-button.next { right: inherit; left: -70px; top: 225px;   }
}




@media (max-width: 900px) {
		
	.search_wrap input[type=text]{ width: 100%;  }
	
	.no_itme a{ display: none; }
	.portfolio_add_wrap{ position: absolute; }
	.nav_menu ul li a > div{ margin-left: 0; margin-top: 1px;  width: 100%; }
	.twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after { width: 200px; margin-left: -100px; background: none; box-shadow: none;   }	
	
	
	.portfolio_add_wrap .type4 .phto_item{ padding: 0; }
	.phto_item strong{ margin: 1px 0;  }
	.portfolio_memo .l strong, .portfolio_memo .r strong { line-height: 1.3;  }
	
	.detail_memo img{ height: auto !important; }
	.detail_title ul li{ margin-left: 5px; }
	.detail_title ul li.del a{ padding: 9px 8px; height: 39px; }
	
	
	 #nav{ width: 100%; position: static; padding:  0;  }
	 #container{ float: none; width: 100%;  }
	 .nav_banner{ display: none;  }
	 #nav h1{ width: 100px; float: left; margin: 6px 0; }
	#nav .user{ margin-top: 0; float: right;   }
	.user .phto{ width: 50px; height: 50px; padding: 5px; margin-top: 2px; }
	.user .name {     width: calc(100% - 60px); padding: 5px 0;  }
	.user .name strong{ font-size: 17px;  }
	
	
	.nav_menu ul{ display: flex;   }
	
	
	.nav_menu ul li {  width: auto; text-align: center;   }
	.nav_menu ul li a i{ float: none;  }
	.nav_menu ul li a span{ float: none; display: inline-block; width: 100%; margin: 5px 0 0 ; font-size: 16px;  }
	.nav_menu{ margin-top: 10px;  }
	
	
	
	
	.nav_wrap > .content { padding: 5px 10px 0; display: inline-block; width: 100%; position: fixed; top:0; background: #f0f2f7; z-index: 99999999 }
	.nav_menu .content { overflow: hidden;  }
	.nav_menu ul li a{ margin-top: 0;  }
	.nav_menu{  padding-top: 75px;  }
	#nav{ min-height: auto;  }
	
	.main_container{ background: #fff; padding: 0; margin-top: 20px;   }
	
	.main_top{ padding: 0; text-align: center; margin-top: 30px;  }
	.main_container .main_top > div{ width: 100%; display: inline-block; float: none; height: auto;  }
	.main_top .left h3 br{ display: none;  }
	.main_top .right ul { position: static; width: 100%; margin-top: 30px;  }
	.main_top .right ul li{ width: 93%; margin-right: 20px;  }
	
	.main_top .right ul .flickity-slider {  left: 70px !important;   }
	
	
	.main_bottom .right, .main_bottom .left { float: none; width: 100%; display: inline-block;  }
	
	#container{ padding: 0px  }
	.main_container#container { padding-top: 30px;  }
	.main_top .left .btn{ display: none }
	.main_top .right .btn{ display: inline-block;  }
	.main_container .main_top .btn{  margin-top: 10px; }
	.main_bottom{ padding: 0px; display: flex; flex-direction: column; }


	.main_bottom .left ul{ margin-top: 20px;  }
	
	
		.main_bottom .right {  order: 1; width: 100%; }

	.main_bottom .left {   order: 2;  width: 100%; padding: 0 5px; margin-top: 20px; padding-top: 50px; padding-bottom: 30px; background: #f0f2f7;  }
	.main_bottom .left h3{ padding: 0 10px; }
	.main_bottom .right{ padding: 0 15px; margin: 50px 0; text-align: center;  }
	
	.main_bottom .right strong { float: none; margin-top: 20px; padding: 17px 25px; padding-right: 80px; font-size: 15px; background-position: 90% 20px; }
	
	.main_top .btn a{  padding: 17px 25px; padding-right: 80px; font-size: 15px; background-position: 90% 20px;   }
	.mo_banner{ display: inline-block; width: 100%;  }
	
	
	#container.main_container{ width: 100%; padding: 0; }
	.main_bottom .left ul li .memo span.notice_name{ display: none;  }
	.main_bottom .left ul li .memo span.notice_date { width: 40%; }
	.main_bottom .left ul strong { width: 60%; }
	
	.portfolio_list ul li.portfolio_btn, .portfolio_list ul li{ margin:  5px; width: calc(50% - 15px);   }
	.portfolio_list ul li.portfolio_btn, .phto_list ul li.phto_btn{ width: 0; height: 0; padding: 0; margin: 1px  }
	
	
	
	
	.search_wrap a{ display: none;  }
	
	
	.portfolio_list ul li.item_memo a span{ display: inline-block;  }
	
	.portfolio_list ul li.item_memo a:after { position: absolute; top:0; left: 0; width: 100%; height: calc(100% - 5px); height: 100%; background: rgba(0,0,0,0.2); display: inline-block; content:""; 
	border-radius: 35px; }
	
	.phto_list ul li.item_memo a:after{ border-radius: 0;  }
	
	
	.portfolio_list{ padding: 0 17px;  }
	
	.search_wrap{ padding: 10px 20px 0px 20px }
	.detail_wrap{ padding: 10px 0px;  }
	
	.detail_wrap .carousel{ position: relative; z-index: 999999999  }
	
	.detail_title ul li div, .detail_title ul li form, .detail_title ul li a, .detail_title ul li.view div{ padding: 5px 10px 1px; height: 40px;  }
	.detail_title ul{ float: none; display: inline-block;  margin-top: 10px; margin-bottom: 10px;   }
	
	
	.detail_wrap .flickity-enabled .carousel-cell{ height: auto; }
	.portfolio_wrap{ height: auto; overflow: visible; min-height: auto; max-height: none;  margin-top: 20px;  height: 310px;  }
	.portfolio_wrap .type2 > .l, .portfolio_wrap .type2 > .r{  width: 100%; float: none;  position: static; }
	.portfolio_wrap .type2 > .r{ display: inline-block; width: 100%;  }
	.portfolio_wrap .type2 .r .phto{ position: static; padding: 0 }
	
	.portfolio_wrap .type2 .r .phto ul li{ height: auto; width: 50px; float: left; margin: 3px   }
	.portfolio_detail_wrap .type2 .portfolio_memo { height: auto; padding-top: 2px;  }
	.portfolio_detail_wrap .type2 .r .portfolio_memo { display: none   }
	
	.portfolio_wrap .type2 .r .phto ul li .img {height: 50px !important; display: inline-block; width: 100%;  }
	
	.detail_title{ padding: 0 10px  }
	
	.portfolio_wrap .type2 .title{ padding: 23px 0 0px; }
	.portfolio_wrap .type2 .title .phto{ position: static; display: inline-block; width: 100%; margin-top: 13px; height: 270px;  }
	.portfolio_wrap .type2 .title .phto .portfolio_memo{ padding: 5px 8px }
	
	.portfolio_wrap .type2 .title h3{ font-size: 25px; }
	
	#container.container_portfolio_pop .portfolio_wrap .type2 .title { padding-top: 50px }
	#container.container_portfolio_pop .portfolio_wrap, #container.container_portfolio_pop .detail_wrap .flickity-enabled .carousel-cell { height: auto;  }
	
	.about_search_wrap span{ display: none  }
	.about_top ul li{ width: 90%;  }
	.about_list ul li .phto{ width: 100%; height: 100px;  }
	.about_list ul li .memo{ float: none; width: 100%; padding: 10px; display: inline-block;  }
	.about_list ul li .memo p { display: none;  }
	.about_list ul li .memo strong{ font-size: 15px;  }
	.about_list{ padding: 10px  }
	.about_top{ padding: 20px 20px  }
	
	.portfolio_wrap   { height: auto !important;      position: absolute;
    left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0;  }
	
	.portfolio_wrap .type2 .r .phto ul li.on .img, .portfolio_add_wrap .type4 li.on .img{ border-width: 3px }
	.portfolio_wrap .type2 .r .phto .img img, .portfolio_add_wrap .type4 .phto_item .img img { width: 105%; height: 105%; max-width: 105%;     position: absolute;
    left: 50%;  top: 50%; transform: translate(-50%, -50%); }
    
    
    .portfolio_wrap .type2 .r .phto .img img:first-child { z-index: 99 }
    
    
	.portfolio_add_wrap .type4 .phto_item ul li .img .img_item img { width: 105%; height: 105%; max-width: 105%;  }
	#nav .user{ max-width: calc(100% - 110px); }
	.user .name strong, .user .name span {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
	
	.detail_wrap .flickity-enabled .carousel-cell, .portfolio_detail_wrap .twentytwenty-wrapper { min-height: 490px !important;  background: #fff; }
	
	.portfolio_detail_wrap .twentytwenty-wrapper { background: #fff;  }
	.portfolio_detail_wrap .twentytwenty.type3 {  height: 300px !important; margin: 100px 0; background: #fff;  }
	
	.portfolio_wrap  { margin-bottom: 20px; }
	.comment_wrap{ margin-top: 20px; padding: 0 10px;  }
	.comment_list .user {   width: 100%; border: 0; max-width: 100%; float: none; }
	.comment_list .memo{ float: none; padding: 10px; width: 100%; display: inline-block; position: static; }
	
	.comment_list > ul > li{ position: relative;  }
	.comment_list .memo ul{ position: absolute; top: 10px; right: 10px;  }
	.comment_user .user .name, .comment_list .user .name{  width: calc(100% - 135px); }
	
	.portfolio_detail_wrap .twentytwenty-wrapper{  }
	.mypage_w{ padding: 20px 10px; }
	.no_itme p{ font-size: 13px;  }
	.my_cont1 .no_itme p:after { content :"포트폴리오는 모바일에서 등록하실 수 없습니다."; display: inline-block; width: 100%; margin-top: 10px; line-height: 2;  }
	
	.my_cont1 .no_itme a{ display: none; }
	.no_itme a{  background: #2574f6; color: #fff; }
	
	.mypage_w .my_phto .logout input { background: #eee;  }
	.add_wrap{ padding: 10px;  }
	
	#phto_add .detail_title ul { width: auto; float: right; }
	#phto_add .detail_title ul li { float: right;   }
	#phto_add .detail_title h3{ margin-top: 10px; }
	
	
	.detail_title ul li.del , .detail_title ul li.set {  display: none }
	.detail_title ul li.del2 { display: inline-block;  }
	.detail_title ul li.del2 a { line-height: 23px;  }
	
	
	.portfolio_add_wrap .type4 .title .h3{  width: 100%; }
	.portfolio_add_wrap .type4 .phto{ height: 150px;  }
	.portfolio_add_wrap .type4 > div { padding: 20px 0; }
	.portfolio_detail_wrap .portfolio_add_wrap .type4 .phto_item .img{ height: 50px;  }
	.detail_title{ text-align: center;  }
	
	.detail_title ul li.enlargement a span{ margin-top: 10px;  }
	.detail_title h3{ float: none;  }
	
	.portfolio_detail_wrap .portfolio_add_wrap .type4 .p { width: 100%; padding: 5px;  }
		.portfolio_add_wrap .type4 .title .h3{ font-size: 17px }
		
		.portfolio_add_wrap .type4 .p{ font-size: 10px  }
		.portfolio_detail_wrap .portfolio_add_wrap .phto_item .portfolio_memo > div{  width: 100%; ;  }
		.portfolio_memo .r strong {   }
		
		.portfolio_list ul li.item_memo span{ font-size: 15px; bottom: 15px; 
		    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; height: 32px; }
		
		.detail_title h3{ width: 100%;  line-height: 1.5; font-size: 20px;  }
		
		.phto_detail_wrap .twentytwenty-wrapper { background: none;  }
		
			.phto_detail_wrap{ position: relative; height: 280px; }	
		.phto_detail_wrap .twentytwenty.type3 { margin: 0; }
		
		
		.portfolio_add_wrap .type4 .phto_item ul li{  width: calc(50% - 6px); margin: 7px 3px; }
		
		
		.login_wrap .login_box{ padding: 50px 15px; }
		
		
		
		
		
		
			#container.container_portfolio_pop { float: none; width: 98%; max-width: 1100px; margin: auto; z-index: 0 }
	#container.container_portfolio_pop .detail_wrap { padding: 0;  }
	#container.container_portfolio_pop .portfolio_wrap { height: 600px; max-height:100%;  }
	#container.container_portfolio_pop .detail_wrap .flickity-enabled .carousel-cell { height: 600px;    }
	
	#container.container_portfolio_pop .portfolio_wrap .type2 .r .phto .img { height: 100px;  }
	
	#container.container_portfolio_pop .portfolio_wrap .type2 .r .phto ul li:nth-child(1) .img,
	 #container.container_portfolio_pop .portfolio_wrap .type2 .r .phto ul li:nth-child(2) .img { height: 230px;  }
	
	#container.container_portfolio_pop .portfolio_add_wrap .type4 .p { height: auto;  }
	
	#container.container_portfolio_pop .portfolio_add_wrap, #container.container_portfolio_pop .portfolio_add_wrap .type4 {height: 100%; max-height:100%;   }
	#container.container_portfolio_pop .portfolio_add_wrap .type4 > .l, #container.container_portfolio_pop .portfolio_add_wrap .type4 > .r  {height: 100%; max-height:100%;   }
	#container.container_portfolio_pop .portfolio_add_wrap .type4 .phto { height: 150px;  }
	#container.container_portfolio_pop .portfolio_detail_wrap .portfolio_add_wrap .type4 .phto_item .img { height: 70px;    }
	
	
	.detail_title ul li.enlargement a span, .detail_title ul li span { margin-top: 9px;  }
	.login_wrap{ padding-top: 30px; }
	.login_wrap .login_box{ margin-top: 15px; padding-top: 20px; }
	.login_wrap h1 img { width: 135px; }
	
	.swiper-container, .swiper-container ul, .swiper-container ul li{ height: 100% !important; } 
	.portfolio_detail_wrap{  height: 100% !important; }
	
	.portfolio_wrap .type2 > .l{ box-shadow: none;  }
	
	.portfolio_wrap .type2 .title h3{ font-size: 20px;  }
	.portfolio_wrap .type2 .title p{ font-size: 11px; }
	.portfolio_add_wrap .type4 .phto{ width: 97%;  }
	
	
	
	.portfolio_detail_wrap.phto_detail_wrap  { height: 300px !important; }
	
	.inventory_search_wrap .search_date input{ width: 130px;  }
	
	
	.inventory_search_wrap > input[type=text] { width: calc(100% - 470px);  }

	
}




@media (max-width: 1230px) {
	
	.inventory_search_wrap.search_wrap a{ display: inline-block; }	
	.inventory_search_wrap > input[type=text] { width:  width: calc(100% - 470px);  margin-left: 10px;    }
}

@media (max-width: 700px) {
	.inventory_search_wrap .search_date input{ width: calc(50% - 10px);  }
	
	.inventory_search_wrap > input[type=text] { width: calc(100% - 180px);  margin-left: 0px; margin-right: 10px;   }
	
	.inventory_search_wrap.search_wrap a{ display: inline-block; }	
	
}




@media (max-width: 391px) {
	
	
	.inventory_search_wrap.search_wrap a{ display: inline-block; width: 100px; font-size: 13px; padding: 13px 15px; }	
	.inventory_search_wrap > input[type=text] { width: calc(100% - 110px);  margin-left: 0px;    }
	
	
	
	.inventory_search_wrap.search_wrap a{ display: inline-block; }	
	
	
	
	.inventory_list tr td a {  padding: 19px 10px;  }
	/* .detail_memo_W table { border-collapse: inherit !important; word-break: break-all; max-width: 100% !important;
	display: table;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;   }
    
    
	.detail_memo_W table td { width: inherit !important;}
	 .detail_memo_W table col {
        width: 100% !important;
    }
    
    
	 .detail_memo_W table tbody tr td {
        width: 100%;
        display: flex;
        margin-bottom: 2px;
        padding: 5px;
        border-bottom: none;
        font-size: 14px;
        line-height: 18px;
         word-break: break-all;
    }
	 */
}