@charset "utf-8";

/*
 * File       : sub-sumi.css
 * Author     : STUDIO-JT (SUMI)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 01) PROJECT - PINTEREST
 */



/* **************************************** ****************************************
 *  PROJECT - PINTEREST
 * **************************************** */
 body.page-template-projects-pinterest { background:#eee;}
 body.page-template-projects-pinterest #footer {clear:both;}
 body.page-template-projects-pinterest .main_container {padding-top:206px;}
 /*body.page-template-projects-pinterest #header.minimize { z-index: 100; background: rgba(238,238,238,0.9); padding-bottom: 60px; padding-top: 30px;}
 body.page-template-projects-pinterest #header.minimize #logo{ width: 65px; height: 67px;}
 body.page-template-projects-pinterest #header.minimize #logo svg { width: 65px; height: 63px;}*/
 .project_pinterest { margin:0 60px; visibility:hidden;}

/* 기본셋팅 */
html:not(.mobile) .pinterest_popup_open #header {padding-right:17px;}
.jt_isotope_pinterest {margin:0 auto;}
.jt_isotope_pinterest .isotope_grid_sizer {width: 236px;}
.jt_isotope_pinterest .isotope_gutter_sizer {width: 21.9px;}
.jt_isotope_pinterest .pinterest_item {width: 236px;height: auto;  float: left;margin-bottom: 60px; }
.jt_isotope_pinterest .pinterest_item a {display:block;}
.jt_isotope_pinterest .pinterest_item img {  display: block;  width: 100%;}
.jt_isotope_pinterest .pinterest_item .pinterest_fig { border-radius:5px; overflow:hidden;  position:relative;}
.jt_isotope_pinterest .pinterest_item .pinterest_fig img { width:100%; display:block;}
.jt_isotope_pinterest .pinterest_item .pinterest_fig:after { content:''; display:block; background:rgba(255,252,0,0.5); position:absolute; top:0; left:0; right:0; bottom:0; opacity:0; transition:all 300ms;}
html:not(.mobile) .jt_isotope_pinterest .pinterest_item a:hover .pinterest_fig:after { opacity:1; }
.jt_isotope_pinterest .pinterest_item_title {margin-top:10px; margin-bottom:-30px; color:#222;}

.pinterest_popup { max-width:1128px; margin:126px auto; display:table; position:relative; }
.pinterest_popup > div { width:50%; display:table-cell; vertical-align:top;}
.pinterest_img_wrap img { display:block; }
.pinterest_meta_wrap {padding: 84px 80px; background:#fff; }
.pinterest_meta_wrap h2 {font-family: 'proxima', 'NotoSansKR', sans-serif;font-size: 34px;font-weight: 600;color: #222;line-height: 1.25;}
.pinterest_meta_wrap p {margin-top: 14px;font-size:14px;color:#444;line-height: 2;font-weight:500;}
.pinterest_meta_wrap p strong {background: #fffd7f;}
.pinterest_meta_wrap a.view_btn_site {width:auto;height:auto;position:relative;padding: 17px 98px 18px 38px;margin-top:33px;font-size:15px;color:#fff;background:#dc372b;border:2px solid #dc372b;border-radius:3px;display: inline-block;line-height:normal;}
html:not(.mobile) .pinterest_meta_wrap a.view_btn_site:hover {background:#fff; color:#dc372b;}
.pinterest_meta_wrap a.view_btn_site:after {height: 21px; top:50%;margin-top: -11px;}

.pinterest_popup .mfp-close {position:absolute;right: -53px;top: -8px; font-size:0; -webkit-transition: all 300ms; transition: all 300ms;}
.pinterest_popup .mfp-close:before {font-family:'jt-font';content:'\e929';font-size: 24px;font-weight:600;color:#fff;}

.pinterest_meta_inner.stick { position:fixed}

.pinterest_popup_img_only .pinterest_img_wrap { width:100%; }
.pinterest_popup_img_only .pinterest_meta_wrap {display:none;}

#loadmore {text-align:center; margin:40px auto; display:none;}
.loadmore_icon { display: inline-block; position: relative; width: 64px; height: 64px; } 
.loadmore_icon span { position: absolute; top: 27px; width: 11px; height: 11px; border-radius: 50%; background: #0b21ee; animation-timing-function: cubic-bezier(0, 1, 1, 0); } 
.loadmore_icon span:nth-child(1) { left: 6px; animation: loadmore_icon1 0.6s infinite; } 
.loadmore_icon span:nth-child(2) { left: 6px; animation: loadmore_icon2 0.6s infinite; } 
.loadmore_icon span:nth-child(3) { left: 26px; animation: loadmore_icon2 0.6s infinite; } 
.loadmore_icon span:nth-child(4) { left: 45px; animation: loadmore_icon3 0.6s infinite; } 
@keyframes loadmore_icon1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } 
@keyframes loadmore_icon3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } 
@keyframes loadmore_icon2 { 0% { transform: translate(0, 0); } 100% { transform: translate(19px, 0); } }


@media (max-width: 1800px) {
    body.page-template-projects-pinterest .main_container {padding-top:180px;}
    .project_pinterest { margin:0 32px}
}

@media (max-width: 1460px) {

     body.page-template-projects-pinterest #header {background:#eee; }
	 body.page-template-projects-pinterest #header.minimize { background:#fff;}
	 body.page-template-projects-pinterest .main_container {padding-top:150px;}

	 .pinterest_meta_wrap {padding:84px 50px;}
	 .pinterest_meta_wrap p br { display:none;}
	 .pinterest_popup .mfp-close { right:-10px; top:-45px;}

}

@media (max-width: 1023px) {

    .pinterest_popup {max-width:564px;}
    .pinterest_popup > div { width:100%; display:block;}
	.pinterest_img_wrap img { width:100%; margin: 0 auto;}

    .pinterest_meta_wrap {padding:50px;}
	.pinterest_meta_wrap a.view_btn_site {padding:12px 60px 12px 25px;}
	.pinterest_meta_wrap a.view_btn_site:after { font-size: 16px; right: 15px; margin-top:-8px;}
	
}

@media (max-width: 768px) {
    body.page-template-projects-pinterest .main_container {padding-top:110px;}
    body.page-template-projects-pinterest .small_menu_btn { background:none;}
    .project_pinterest { margin:0 20px}
	.jt_isotope_pinterest { width:100% !important;}
	.jt_isotope_pinterest .isotope_grid_sizer {width: 48%;}
    .jt_isotope_pinterest .isotope_gutter_sizer {width: 4%;}
	.jt_isotope_pinterest .pinterest_item {width: 48%; margin-bottom:30px;}
	.jt_isotope_pinterest .pinterest_item_title { margin-bottom:-15px;}
	.pinterest_meta_wrap {padding:7% 6%;}
	.pinterest_meta_wrap h2 {font-size: 22px;}
	.pinterest_popup .mfp-close {top:-40px;}
	.pinterest_popup .mfp-close:before {font-size:18px;}
	.pinterest_meta_wrap a.view_btn_site {font-size:14px; margin-top:25px;}

}

@media (max-width: 540px) {

      .jt_isotope_pinterest .pinterest_item { margin-bottom:15px;}  
	  .jt_isotope_pinterest .pinterest_item_title { margin-bottom:0px;}

}