@charset "utf-8";

/*
 * File    : rwd-projects.css
 * Author  : STUDIO-JT (JC)
 *
 * SUMMARY :
 * 프로젝트 (아카이브 + 단일) — 반응형
 */

@media (min-width: 2000px) {
/* PROJECT -> AWARDS MOTION */
.project_awards_notice_bubble {right: calc(7% - 47px * 1);}

.project_awards_notice_playground {right: calc(7% - 52px * 1);}
}

@media (min-width: 1461px) {
/* PROJECT -> AWARDS MOTION */
body.show-project-awards .project {position: relative;z-index: 2;}
}

@media (max-width: 1860px) {
/* PROJECT -> AWARDS MOTION */
.project_awards_notice_bubble {right: 2vw;transform: scale(0.9);}

.project_awards_notice_playground {right: 2vw;}

.project_awards_notice_playground > a {transform: scale(0.9);}
}

@media (max-width: 1800px) {
.project_pinterest { margin:0 32px}
/* SINGLE-PROJECT UI BLEND MODE */
.single-projects .fake_logo { width:65px; height:67px; left:32px; top:32px; }

.single-projects .fake_logo svg { width:65px; height:63px; }

.single-projects .fake_menu_btn_text { top:55px; right:107px; }
/* PROJECT */
.project_header_txt > span{letter-spacing: 0.5em;}

.project_header_txt_01{left: 160px;}

.project_header_txt_02{right: 200px;}

.project_header_txt { margin-top: -15px;}
}

@media (max-width: 1664px) {
/* SINGLE-PROJECT UI BLEND MODE */
.single-projects .fake_menu_btn_text { top:103px; right:45px; }
/* PROJECT -> AWARDS MOTION */
.project_awards_notice_bubble {bottom: 70px;right: 20px;transform: scale(0.8);}

.project_awards_notice_playground {right: 15px;}

.project_awards_notice_playground > a {transform: scale(0.8);}
}

@media (max-width: 1460px) {
/* SINGLE-PROJECT UI BLEND MODE */
.single-projects #header.minimize #logo { opacity: 1; }

.single-projects #header.minimize + #barba-wrapper .fake_logo { visibility: hidden; opacity: 0; width: 38px; height: 38px; top:12px; }

.single-projects #header.minimize + #barba-wrapper .fake_logo svg { width:38px; height:38px; }

.single-projects .fake_menu_btn_text { top:55px; right:107px; }

.single-projects #header.minimize + #barba-wrapper .fake_menu_btn_text { visibility: hidden; right:80px; top:30px; }
.single-projects #header.minimize {background: #fff;}

.single-projects #header.minimize .logo_secondary {opacity: 0;visibility: hidden;}

.single-projects #header.minimize .logo_sticky {opacity: 1;visibility: visible;}

.single-projects #header.minimize .small_menu_btn_line {background: #333;}

/* PROJECT VIEW */
.project {padding-top:0;}

.project_header_teble { max-width:940px}

.project_header_txt > span{font-size:50px; letter-spacing: 0.5em;}

.project_header_txt_01{left: 0;}

.project_header_txt_02{right: 39px;}

.single-projects #header {background: transparent;}

.single-projects #header.project_minimize {background: #fff;}

.single-projects .minimize .header_typo {opacity: 0;}

/* jtstickynav */
.single_sticky_nav_menu_anchor { padding: 17.5px 20px; }

.single_sticky_nav_menu_anchor_share { padding: 16.5px 20px; }

.single_sticky_nav_pagenation_anchor { width: 55px; padding: 17.5px 7.5px; }

/* PROJECT -> AWARDS MOTION */
.project_awards_notice {display: none;}
}

@media (max-width: 1280px) {
/* PROJECT VIEW */
.project_header .scroll_down {bottom: 3%;}

/* PROJECT AWARD */
.award_card li {width: 230px;height: 380px;margin: 25px 25px;}
}

@media (max-width: 1023px) {
.single_content_view .motion_with_code_wrap .info_title a.view_btn_site {width: 180px;height: 50px;padding: 0 45px 0 24px;font-size: 13px;line-height: 46px;}
/* PROJECT VIEW */
.project_header_teble { max-width:710px}

/*.project_header_txt > span {font-size: 55px;letter-spacing: 0.4em;}*/
.project_header_txt > span{font-size:45px;letter-spacing: 0.4em;}

.project_header_txt_02{right: 49px;}

.project_view .project_index h1 {font-size:45px;}

.view_btn_site {width:195px; height:48px; padding:0 40px 0 25px; line-height:44px;}

.view_btn_site:after {font-size:16px; right:15px;}

.project_btn {padding: 7px 22px;}

.project_slider_control {height: 60px;margin-top: -30px;}

.project_slider_control > div {width: 60px;}

.project_slider_control span:after {line-height: 60px;}

.project_slider_prev {left: 3%;}

.project_slider_next {right: 3%;}

.project_view .project_meta_wrap {padding-top: 100px;padding-bottom: 100px;}

.project_view .jt_project_detail img, .jt_project_detail .wp-caption, .iframe_video_container, .jt_project_slider_wrap {margin: 120px auto;}

.jt_project_detail blockquote:before {display: inline-block;vertical-align: super;position: static;margin: -10px 17px 0 0;}

.jt_project_detail blockquote p br {display: none;}

.jt_interview_answer + .jt_interview_answer {margin-top: 50px;}

.jt_project_detail .jt_interview_wrap h2 {margin-bottom: 46px;}

.jt_interview_people {width: auto;position: static;margin-bottom: 20px;font-size: 0;text-align: left;}

.jt_interview_people figure {display: inline-block;vertical-align: middle;width: 54px;border-width: 3px;}

.jt_interview_people span {display: inline-block;vertical-align: middle;margin-top: 0;padding-left: 15px;}

.project_view .jt_project_detail .jt_interview_wrap + img, .jt_project_detail .jt_interview_wrap + .wp-caption, .jt_interview_wrap + .jt_video_wrap, .jt_interview_wrap + .jt_project_slider_wrap, .project_view .jt_project_detail p + img, .jt_project_detail p + .wp-caption, .jt_project_detail p + .jt_video_wrap, .jt_project_detail p + .jt_project_slider_wrap {margin-top: 65px;}

.jt_project_detail .jt_icondesign_list_wrap + h2, .jt_project_detail .jt_gif_gallery + h2, .jt_project_detail p + h2 {margin-top: 120px;}

.project_view .jt_project_detail .jt_project_detail_imgroup img + img,
    .project_view .jt_project_detail .jt_project_detail_imgroup .video_container + .video_container,
    .project_view .jt_project_detail .jt_project_detail_imgroup img + .video_container,
    .project_view .jt_project_detail .jt_project_detail_imgroup .video_container + img {margin-top: -120px;}

.jt_interview_wrap + .video_container, .jt_project_detail p + .video_container { margin-top: 65px; }

/* SCROLL TOP */
.single-projects.single_sticky_nav_show .scroll_top.js_scroll_top_fix {bottom: 80px;}
}

@media (max-width: 768px) {
/* 디테일 커스텀 : 프로젝트 - 맨노블레스 */
.project_view .jt_project_detail img.projects-mennoblesse-mustache { max-width: 50%; margin-left: auto; margin-right: auto; }
.jt_project_detail .jt_project_casestudy { overflow: hidden; }

.jt_project_detail .jt_project_casestudy p {margin-left: 0; margin-right: 0;}

.jt_project_detail .jt_project_casestudy .syntaxhighlighter_wrap { padding: 0; margin: 0}

.jt_project_detail .jt_project_casestudy > div > .syntaxhighlighter_wrap {padding-left: 0; padding-right: 0;margin: 0 5% 11% 3%;}

.jt_project_detail .jt_project_casestudy h2 { margin-left: 0; margin-right: 0; padding-right: 5%; padding-left: 5%;}

.jt_project_detail .jt_project_casestudy h3 { margin-bottom: 6%;}

.jt_project_detail .dual_img > div { padding: 0;}

.jt_project_detail .jt_project_casestudy p img { margin-left: -5%; width: 100vw; display: block; max-width: inherit;}

/* project disqus */
.project_view .comments_container{ margin-top: 0; margin-bottom: 7%; padding-top: 0; padding-bottom: 5%;}
.single_content_view .motion_with_code_wrap .info_title a.view_btn_site { margin-top:0; }
.project_pinterest { margin:0 20px}
/* SINGLE-PROJECT UI BLEND MODE */
.single-projects.open_menu #logo { opacity: 1; }

.single-projects .fake_logo { width:48px; height:51px; left:20px; top:30px; }

.single-projects .fake_logo svg { width: 48px; height: 48px; }

.single-projects .fake_menu_btn_text { display: none; }
body.open_menu.single-projects .logo_secondary {opacity: 0;visibility: hidden;}

body.open_menu.single-projects .logo_primary {opacity: 1;visibility: visible;}

.single-projects .scroll_top {top: -125px;}

.jt_interview_wrap + .video_container, .jt_project_detail p + .video_container { margin-top: 7%; }

/* jtstickynav */
.single_sticky_nav_menu_anchor_main .icon-enter,
    .single_sticky_nav_menu_anchor_share .icon-share,
    .single_sticky_nav_menu_anchor_request .icon-project { margin-left: 0; }

.single_sticky_nav_menu_anchor,
    .single_sticky_nav_menu_anchor:first-child { padding: 16px 14px; }

.single_sticky_nav_menu_anchor_share,
    .single_sticky_nav_menu_anchor_request { padding: 15px 14px; }

.single_sticky_nav_menu_anchor:after { height: 20px; }

.single_sticky_nav_menu_anchor_text { display: none; }

.single_sticky_nav_pagenation_anchor { width: 50px; height: 50px; padding: 16px 7.5px; }

.single_sticky_nav_pagenation_anchor:before { display: none; }

.single_sticky_nav_pagenation_anchor .icon-arrow { right: 0; left: 0; margin: auto; }

.single_sticky_nav_pagenation_text{display: none;}

.single_sticky_nav_menu_share { bottom: 67px; left: 0; min-width: 160px; min-height: 50px; }

.single_sticky_nav_menu_share:after { left: -120px; }

.single_sticky_nav_menu_anchor:hover, .single_sticky_nav_pagenation_anchor:hover{color: #666;color: rgba(255, 255, 255, .5);}

/* PROJECT VIEW */
.project_header .scroll_down {width: 50px;height: 30px;}

.project_header .scroll_down:after {font-size: 28px;line-height: 30px;}

.project_minimize .small_menu_btn {background: rgba(255, 255, 255, .95);}

.project_btn {margin-top: 15px;}

.jt_project_slider_wrap {margin: 17% auto;}

.project_slider_control {height: 50px;margin-top: -25px;}

.project_slider_control > div {width: 50px;}

.project_slider_control span:after {line-height: 50px;}

.project .jt_loadmore {margin-top: 0;padding: 7% 0;}

.project .jt_loadmore_inner {padding: 20px 0 0;}

.project_view .jt_project_detail > *:last-child {margin-bottom: 5%;}

.project_view .jt_project_detail img {margin: 17% 0;}

.jt_project_detail .wp-caption {margin: 17% 0;}

.jt_project_detail .wp-caption p.wp-caption-text {margin-top: 15px;font-size: 13px;line-height: 1.5;}

.jt_project_detail h2 {font-size:22px;margin: 0 6% 12px;}

.jt_project_detail h2 br {display: none;}

.jt_project_detail p {margin: 0 6% 3%;font-size: 14px;}

.jt_project_detail p br {display:none;}

.jt_project_detail p strong {font-size: 17px;}

.jt_project_detail blockquote {margin: 6% 6%;padding: 0 0 4px;}

.jt_project_detail blockquote p {font-size: 16px;}

.jt_project_detail blockquote:before, .jt_project_detail blockquote:after {font-size: 17px;}

.jt_project_detail blockquote:before {margin-right: 8px;}

.jt_project_detail blockquote:after {margin-left: 8px;}

.jt_interview_wrap {margin: 7% 6%;}

.project_btn_wrap {margin: 0 6%;}

.jt_interview_people figure {width: 48px;}

.jt_interview_people span {padding-left: 12px;}

.jt_interview_answer + .jt_interview_answer {margin-top: 42px;}

.jt_project_detail .jt_interview_wrap h2 {margin-left: 0;margin-right: 0;margin-bottom: 32px;}

.jt_project_detail .jt_interview_txt > p, .jt_project_detail .jt_interview_txt > blockquote {margin-left: 0;margin-right: 0;}

.project_view .jt_project_detail .jt_interview_txt img {transform: scale(0.6);margin-left: -0.4em;margin-right: -0.4em;}

.jt_project_detail .jt_icondesign_list_wrap + h2, .jt_project_detail .jt_gif_gallery + h2, .jt_project_detail p + h2 {margin-top: 17%;}

.project_view .jt_project_detail .jt_interview_wrap + img, .jt_project_detail .jt_interview_wrap + .wp-caption, .jt_interview_wrap + .jt_video_wrap, .jt_interview_wrap + .jt_project_slider_wrap, .project_view .jt_project_detail p + img, .jt_project_detail p + .wp-caption, .jt_project_detail p + .jt_video_wrap, .jt_project_detail p + .jt_project_slider_wrap {margin-top: 7%;}

.project_view .project_team h2 {font-size: 22px;margin-bottom: 16px;}

.project_view .single_inner_wrap {padding: 10% 0 7% 0;}

.project_view .single_inner_wrap h1 {font-size:22px; margin-bottom:16px;}

.project_view .single_inner_wrap p {font-size: 14px;}

.project_view .single_inner_wrap p br {display:none;}

.project_view .project_meta_wrap {padding: 17% 0;}

.project_view .single_inner_wrap.project_meta_wrap h1 {font-family: sans-serif;font-size: 26px;margin-bottom: 26px;}

.project_meta_wrap .summary {padding: 14px 0 30px;}

.project_meta_wrap .summary li {width: 31%;margin-left: 3.5%;}

.project_meta_name {padding-bottom: 16px;}

.project_view .jt_tag {margin-top:5%; margin-bottom:12%;}

.project_nav_inner {display:block; font-size:0;}

.project_nav_inner > a {display:inline-block; width:40%; height:65px; line-height:63px; padding-top:0; vertical-align:top; border:1px solid #ededed;}

.project_nav_inner > a:hover {padding-bottom:0;}

.project_nav_inner .project_list {display:inline-block; width:20%; height:65px; position:relative; top:inherit; left:inherit; margin-top:inherit; margin-left:inherit; background:none; border-width:1px 0 1px 0; border-color:#ededed;}

.project_nav_inner .project_list:hover {border-color:#ededed;}

.project_nav_inner .project_list .list_line {border-color:#ccc;}

.project_nav_inner .project_list .list_line_01 {top:25px;}

.project_nav_inner .project_list .list_line_02 {top:31px;}

.project_nav_inner .project_list .list_line_03 {top:37px;}

.project_nav_inner > a .bg_wrap  {display:none;}

.project_nav_inner p span {font-size:15px; color:#ccc;}

.project_nav_inner > a .bg_color_wrap {display:none;}

.project_nav_inner > a .page_name {display:none;}

.project_nav_inner .project_nav {display:block; padding:0 20px;}

.project_nav_inner .project_nav:before {content:''; display:block; width:17px; height:12px; position:absolute; top:0px; font-size:19px; font-family:'jt-font'; color:#ccc; -webkit-transition:500ms; transition:500ms;}

.project_nav_inner > a:hover .project_nav:after {display:none;}

.project_nav_inner .project_nav_prev .project_nav:before {content:'\e902'; left:20px;}

.project_nav_inner .project_nav_next .project_nav:before {content:'\e903'; right:20px;}

.safari .project_nav_inner > a {width:40%;}

.safari .project_nav_inner > a .project_nav_info {padding-top:inherit;}

.safari .project_nav_inner > a:hover .project_nav_info {padding-top:inherit;}

.project_view .jt_project_detail .jt_project_detail_imgroup img + img,
    .project_view .jt_project_detail .jt_project_detail_imgroup .video_container + .video_container,
    .project_view .jt_project_detail .jt_project_detail_imgroup img + .video_container,
    .project_view .jt_project_detail .jt_project_detail_imgroup .video_container + img {margin-top: -17%;}

/* PROJECT AWARD */
.award_card {margin:5% 0; padding:5%;}

.award_card li {width: 44%;height: auto;margin: 3%;max-width: 230px;}

.award_card li .award_card_item_inner {padding: 20% 0 40%;-webkit-box-shadow:15px 15px 20px 0px rgba(0, 0, 0, .5);box-shadow:15px 15px 20px 0px rgba(0, 0, 0, .5);}

.award_card li .award_card_year {font-size: 17px;}

.award_card li .award_card_desc {padding: 0 8px;position: absolute;bottom: 12%;}

.award_card li .award_card_desc span {font-size:15px;}

.award_card li .award_card_desc span.award_card_grade {font-size:13px;}

.award_card li img {height: 70px;margin: 18% 0 20%;}

/* PROJECT LIST */
.project_item_title {font-size: 16px;}

.project_item_detail {display: none;}

/* 프로젝트 좋아요 */
.project_view .like_counter { margin-top: -7%; margin-bottom: 5%; padding-top: 3%; padding-bottom: 5%; }

.project_view .like_counter > b { font-size: 46px; }

.project_view .single_inner_wrap.like_counter > p { margin-bottom: 36px; }

.project_view .single_inner_wrap.like_counter > p br { display: block; }

.like_counter_ctrl { transform: scale(0.9); }

.like_counter-layer { transform: scale(0.9); }
}

@media (max-width: 767px) {
/* PROJECT VIEW */
.project_header_teble {max-width: inherit;padding: 0 5%;}

.project_header_txt > span {letter-spacing: 0.2em;line-height: 1.4;}

.project_header_txt_02 {margin-right: 0;right: 0;text-align: left;}
}

@media (max-width: 540px) {
/* PROJECT LIST */
.project_item {/*width:87.5%; padding-top:87.5%;*/ width:-webkit-calc(100% - 40px); width:calc(100% - 40px); padding-top:-webkit-calc(100% - 40px); padding-top:calc(100% - 40px); float:inherit; margin:0 auto 73px auto; overflow:inherit;}

.project_item a {width:100%; height:-webkit-calc(100% + 50px); height:calc(100% + 50px); background: #ffffff; background:rgba(255, 255, 255, .1);}

.project_item_title {left:0; /*bottom:12px;*/ bottom:inherit; top:-webkit-calc(100% - 35px); top:calc(100% - 35px); color:#222; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.25; max-height:2.5em;}

.project .jt_loadmore {padding: 0 0 44px;}

/* PROJECT AWARD */
.award_card li .award_card_year {font-size: 16px;}

.award_card li .award_card_desc span {font-size:14px;}

.award_card li .award_card_desc span.award_card_grade {padding-top: 4px;font-size:12px;}
}

@media (max-width: 480px) {
/* PROJECT VIEW */
.project_header_teble {padding: 0 20px;}

.project_header_txt > span {font-size: 32px;}

.jt_project_detail h2 {margin-left: 20px;margin-right: 20px;}

.jt_project_detail p {margin-left: 20px;margin-right: 20px;}

.jt_project_detail blockquote {margin-left: 20px;margin-right: 20px;}

.jt_project_detail blockquote:before, .jt_project_detail blockquote:after {font-size: 12px;}

.jt_project_detail blockquote:after {margin-bottom: -5px;}

.project_btn_wrap {margin-left: 20px;margin-right: 20px;}

.jt_interview_wrap {margin-left: 20px;margin-right: 20px;}

.jt_project_detail .jt_interview_wrap h2 {margin-bottom: 20px;}

.jt_interview_people {margin-bottom: 12px;}

.jt_interview_people figure {width: 38px;}

.jt_interview_people span {padding-left: 8px;}

.jt_interview_answer + .jt_interview_answer {margin-top: 7%;}

.project_slider_control {height: 35px;margin-top: -17.5px;}

.project_slider_control > div {width: 35px;}

.project_slider_control span:after {font-size: 11px;line-height: 35px;}

.project_slider_prev {left: 2%;}

.project_slider_next {right: 2%;}

.project_meta_wrap .summary {padding: 4px 0 20px;}

.project_meta_wrap .summary li {width:100%; margin-left:0; margin-bottom:20px;}

.project_meta_wrap .summary li h2 {padding-bottom:8px; margin-bottom:5px;border-bottom-width: 1px;border-bottom-color: #ddd;}

.project_meta_wrap .summary li:first-child {margin-top:10px;}

.project_meta_wrap .summary li:last-child {margin-bottom:0;}

.project_meta_name {padding-bottom: 10px;}

.project_view .jt_tag {margin-top: 30px;}

.project_nav_inner .project_nav {padding:0 40px;}

.project_nav_inner p span:last-child {display:none;}

/* PROJECT AWARD */
.award_card {padding: 8px;}

.award_card li .award_card_item_inner {padding: 20% 0 44%;-webkit-box-shadow: 10px 10px 15px 0px rgba(0, 0, 0, .5);box-shadow: 10px 10px 15px 0px rgba(0, 0, 0, .5);}

.award_card li .award_card_year {font-size: 15px;}

.award_card li .award_card_desc span {font-size:13px;}

.award_card li .award_card_desc span.award_card_grade {font-size:11px;}

.award_card li img {height: 50px;}

/* 프로젝트 좋아요 */
.project_view .like_counter { margin-bottom: 7%; }

.project_view .like_counter > b { font-size: 44px; }

.project_view .single_inner_wrap.like_counter > p { margin-bottom: 26px; }

.like_counter_ctrl { transform: scale(0.8); }

.like_counter-layer { transform: scale(0.35); }
}

@media (max-width: 350px) {
/* PROJECT AWARD */
.award_card li .award_card_item_inner {padding: 20% 0 50%;}

.award_card li img {margin: 15% 0 20%;}

/* PROJECT VIEW */
.project_header_txt > span {letter-spacing: 0.1em;}
}