@charset "utf-8";

/*
 * File    : rwd-components.css
 * Author  : STUDIO-JT (JC)
 *
 * SUMMARY :
 * 공통 컴포넌트 — 폼/그리드/리스트/영상/공유 등 페이지 공용 UI — 반응형
 */

@media (max-width: 1800px) {
/* BACK TO LIST */
.back_to_list {right:32px;}
}

@media (max-width: 1460px) {
/* BACK TO LIST */
.back_to_list {top: 70px;}
}

@media (max-width: 1400px) {
/* MY IP CUSTOM */
.jt_my_ip { margin-left: 5%; margin-right: 5%; max-width: 100%; }
}

@media (max-width: 1280px) {
/* BLOG LIST - INSTAGRAM */
.category .mfp-arrow-left {left:20px;}

.category .mfp-arrow-left:hover {left:15px;}

.category .mfp-arrow-right {right:20px;}

.category .mfp-arrow-right:hover {right:15px;}
/* CERTIFICATE */
.certificate_thumb {max-width: 300px;}
}

@media (max-width: 1200px) {
/* BLOG LIST - INSTAGRAM */
.category .mfp-container {padding:0 90px;}

.category .mfp-arrow {width:40px; height:40px; margin-top:-20px;}

.category .mfp-arrow:hover {width:50px; height:50px; margin-top:-25px;}

.category .mfp-arrow-left:before, .category .mfp-arrow-right:before {width:40px; height:40px; line-height:40px; font-size:16px;}

.category .mfp-arrow-left:hover:before, .category .mfp-arrow-right:hover:before {width:50px; height:50px; line-height:50px;}

.category .mfp-close {height:30px; right:-50px;}

.category .mfp-close:before, .category .mfp-close:after {height:40px;}

.category .mfp-arrow {-webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1);}
}

@media (max-width: 1180px) {
/* VIDEO */
.iframe_video_container {padding: 80px 40px;}

.iframe_video_container_bg {height: 73%;}

.iframe_video_wrap:after {height: 115px;bottom: -115px;background-size: auto 100%;}
}

@media (max-width: 1092px) {
/* IFRAME VIDEO */
.iframe_video_container.tv_border_line:before {max-width:100%;width: 100vw;height: 2.7472vw;bottom: -1.4652vw;left: 0;margin-left: 0;}
}

@media (max-width: 1023px) {
/* 3컬럼 */
.jt_isotope.isotope_col_3 .isotope_grid_sizer {width: 30%;}

.jt_isotope.isotope_col_3 .isotope_gutter_sizer {width: 5%;}

.jt_isotope.isotope_col_3 .isotope_item {width: 30%;margin-bottom: 5%;}
.jt_motion_card_view { padding: 50px; }

.info_title {padding: 50px 0 0 45px;}
.jt_content_share {padding: 4% 0;}

.jt_content_share .share_sns {width: 47px;height: 47px;}

.jt_content_share .share_sns:after {font-size: 16px;line-height: 47px;}

.jt_content_share .share_sns:before {width: 47px;height: 47px;margin-left: -23.5px;margin-top: -23.5px;}

.jt_content_share .share_sns:hover:before {width: 80px;height: 80px;margin-left: -40px;margin-top: -40px;}

.jt_form_listitem_service:nth-child(n) { clear: none; width: 33.333%; }

.jt_form_listitem_service:nth-child(3n+1) { clear: both; }

input.jt_btn_submit_request {width: 200px;padding: 11px 10px;font-size: 15px;}

input.jt_btn_submit_recruit {width: 200px;padding: 11px 10px;font-size: 15px;}

.video_container { margin: 160px auto; }

/* BLOG LIST */
.blog_itme_content.instagram h2 span i {max-height: 5.1em;-webkit-line-clamp: 3;}

.blog_item .insta_logo {width:20px; height:20px; bottom:10px; right:10px;}

.blog_item .insta_logo:before {font-size:20px; line-height:20px;}

.blog_item:hover .insta_logo {bottom:20px; right:20px;}

.certificate_item {min-height: 128px;}

.certificate_item > div {padding-top: 35px;padding-bottom: 35px;font-size: 15px;}

.certificate_project {padding-right: 30px;}

.certificate_type {width: 30px;}

.certificate_type_symbol {width: 30px;height: 30px;}

.certificate_grade {width: 210px;padding-left: 30px;padding-right: 15px;}

.certificate_grade span {margin-bottom: 2px;font-size: 12px;line-height: 1.45;}

/* MY IP CUSTOM */
.jt_my_ip { padding-top: 7%; padding-bottom: 5%; }

.jt_my_ip h2 { margin-top: 0; margin-bottom: 0; font-size: 60px }
}

@media (max-width: 860px) {
.info_title {width: 100%;padding: 40px 0 0 39px;}

.info_content { width: 100%; padding: 40px 0 37px; }
}

@media (max-width: 768px) {
.jt_category ul {text-align: center;}
.jt_motion_card { padding-bottom: 70px;}

.jt_motion_card_view { padding: 30px }

.motion_with_code_wrap.wrap { margin:0 3%; }

.info_content { padding: 35px 0 37px; }

div.info_content ul li { padding: 0 20px 17px 39px; }

.info_content ul li p { margin:0; }
.jt_isotope_pinterest { width:100% !important;}

.jt_isotope_pinterest .isotope_grid_sizer {width: 48%;}

.jt_isotope_pinterest .isotope_gutter_sizer {width: 4%;}
/* SINGLE */
.single_inner_wrap {margin: 0 6%;}

/* LOADMORE */
.jt_loadmore {margin-top: 6%;margin-bottom: 6%;}

.blog_itme_content {padding: 6% 0;}

.blog_itme_content h2 {padding-bottom: 4px;font-size: 16px;}

.blog_itme_content span:after {top: 3px;right: -20px;font-size: 12px;}

.blog_item:hover figure {-webkit-transform: none;-ms-transform: none;transform: none;}

.blog_item figure:before, .blog_item figure:after {display: none;}

.blog_item:hover .blog_itme_content.instagram {-webkit-transform: none; -ms-transform: none; transform: none;}

.blog_item:hover .insta_logo {bottom:10px; right:10px;}

/* VIDEO */
.video_container { margin: 17% 0; }

.iframe_video_container {margin: 10% 0 17%;padding: 8% 5% 95px;overflow: hidden;}

.iframe_video_container_bg {height: 65%;}

.iframe_video_container.tv_border_line {overflow: visible;}

.iframe_video_wrap {padding: 25px 25px;}

.iframe_video_wrap:after {height: 90px;bottom: -90px;}

.jt_embed_video_container {margin-top: 17%;margin-bottom: 17%;}

.back_to_list {display:none;}

.jt_icondesign_list_wrap {margin: 7% 0;}

.jt_gif_gallery {margin: 7% 0;}

/* MY IP CUSTOM */
.jt_my_ip h2 { font-size: 42px }

.jt_my_ip p { margin-bottom: 0px; }

/* WORDCOUNT */
.jt_wordcount { max-width: inherit; padding-right: 5%; padding-left: 5%; }

.jt_wordcount textarea.jt_form_field { height: 280px; }
}

@media (max-width: 767px) {
/* 3컬럼 */
.jt_isotope.isotope_col_3 .isotope_grid_sizer {width: 48%;}

.jt_isotope.isotope_col_3 .isotope_gutter_sizer {width: 4%;}

.jt_isotope.isotope_col_3 .isotope_item {width: 48%;margin-bottom: 6%;}
/* BLOG LIST - INSTAGRAM */
.category .mfp-container {padding:0;}

.category .mfp-arrow:hover {opacity:0.65;}

.category .mfp-arrow-left, .category .mfp-arrow-left:hover {left:2%;}

.category .mfp-arrow-right, .category .mfp-arrow-right:hover {right:2%;}

.category .mfp-arrow:hover {width:40px; height:40px; margin-top:-20px;}

.category .mfp-arrow-left:hover:before, .category .mfp-arrow-right:hover:before {width:40px; height:40px; line-height:40px; background:#000; opacity:0.65;}

.category .mfp-bottom-bar {margin-top: -90px;padding: 0 2%;}

.category .mfp-title {padding-right:0;}

.category .mfp-instagram-detail {display: block;max-height: inherit;white-space: nowrap;}

.category .mfp-viewmore, .category .mfp-viewmore:hover {opacity:0.7;}

.category .mfp-viewmore {display:block; width:100px; position:relative; top:inherit; right:inherit; margin-top:10px;}

.category img.mfp-img {padding:80px 0 100px;}

.category .mfp-close {width: 30px;top: 50px;right: 0;}

.category .mfp-close:before, .category .mfp-close:after {height:30px; right:12px;}
.blog_itme_content.instagram {display:none;}

.blog_item .insta_logo {width:25px; height:25px;}

.blog_item .insta_logo:before {font-size:25px; line-height:25px;}

.jt_form_listitem_service:nth-child(n) { clear: none; width: 49.999%; margin: 6.2px 0; word-break: keep-all; }

.jt_form_listitem_service:nth-child(2n+1) { clear: both; }

/* fieldset 은 UA 기본값 min-inline-size:min-content 라 내부 요소(textarea 등) 때문에
   모바일 폭 아래로 안 줄어듦 → 0 으로 풀어 컨테이너 폭을 존중하게 함 (폼 가로 오버플로우 해소) */
.jt_fieldset_request, .jt_fieldset_recruit { min-width: 0; min-inline-size: 0; }

.jt_form_listitem_info, .jt_form_listitem_project {margin-top: 20px;}

.jt_form_field_request {height: 48px;}

.jt_form_listitem_project .your-memo {height: 200px;}

.jt-checkbox .jt_label.jt_label_service {padding: 0 10px 0 30px;}

.jt_form_list_service {padding-top: 0px;}

input.jt_btn_submit_request {width: 175px;padding: 8.5px 10px;font-size: 14px;}

.jt_agree_check_request {padding: 20px 0px 20px 2px;}

.jt_form_field_recruit {height: 48px;}

.jt_fieldset_recruit .your-memo {height: 200px;}

.jt_agree_check_recruit {padding: 20px 0 20px 30px;}

input.jt_btn_submit_recruit {width: 175px;padding: 8.5px 10px;font-size: 14px;}

/* OFFLINE */

.certificate_list {/*margin-bottom: 10%;*/margin-bottom: 120px;}

.certificate_item {display: block;min-height: 1px;padding: 20px 0 20px 36px;}

html.ios .certificate_item {padding-top: 22px;padding-bottom: 19px;}

.certificate_item > div {display: block;padding-top: 0;padding-bottom: 0;}

.certificate_item > div.certificate_project {padding-right: 0;}

.certificate_item > div.certificate_type {width: 24px;position: absolute;left: 0;top: 23px;}

.certificate_type_symbol {width: 24px;height: 24px;}

.certificate_item > div.certificate_grade {width: auto;padding-left: 0;padding-right: 0;padding-top: 5px;font-size: 14px;}

.certificate_grade span {margin-bottom: 1px;}

.certificate_thumb {max-width: 250px;}
}

@media (max-width: 540px) {
.jt_search {width: 100%;max-width: 390px;margin: 0 auto;}

.jt_search_field {width: 72%;}

.jt_search_input {width: -webkit-calc(100% - 59px);width: calc(100% - 59px);}
/* WORDCOUNT */
.jt_wordcount .jt-radiobox li { width: 50%; padding-left: 0; }
}

@media (max-width: 480px) {
/* SINGLE */
.single_inner_wrap {margin: 0 20px;}

/* TAG */
.jt_tag > span {width: 45px;height: 20px;font-size: 12px;line-height: 20px;}

.jt_tag nav {padding-left: 45px;}

.jt_tag a {line-height: 1.5;}

.jt_content_share {padding: 6% 0;}

/* BLOG LIST */
.blog_itme_content h2 {margin-bottom: 0;font-size: 15px;}

.blog_itme_content span {font-size: 12px;}

.blog_itme_content span:after {top: 3px;right: -16px;font-size: 10px;}

.blog_item .insta_logo {width:20px; height:20px;}

.blog_item .insta_logo:before {font-size:20px; line-height:20px;}

html.android .blog_itme_content span:after { top:2px; }

html.ios .blog_itme_content span:after { top:1px; }

/* VIDEO */
.iframe_video_container {padding: 8% 5% 50px;}

.iframe_video_container_bg {height: 60%;}

.iframe_video_wrap {padding: 15px 15px;border-radius: 15px;}

.iframe_video_wrap:after {height: 50px;bottom: -50px;}

.jt_agree_check_request {padding: 10px 0px 25px 2px;}

.certificate_list {margin-bottom: 90px;}

/* MY IP CUSTOM */
.jt_my_ip h2 { font-size: 32px }

.jt_my_ip a.jt_ip_copy_btn { margin: 10px 0; }

/* WORDCOUNT */
.jt_wordcount textarea.jt_form_field { height: 220px; }

.jt_wordcount .jt_wordcount_data { margin-top: 16px; padding: 22px 25px; }
}

@media (max-width: 460px) {
.jt_motion_card_view {padding: 15px;}

.info_title {padding: 20px 0 0 25px;}

.info_content {padding: 25px 0 22px;}

div.info_content ul li { padding: 0 20px 7px 25px; }

.info_content ul { margin-bottom:-17px; }

.info_content ul li:nth-child(3n-2),
    .info_content ul li:nth-child(3n-1),
    .info_content ul li:nth-child(3n) { width: 50%; }

.info_content ul li:nth-child(3n+1) { clear:none; }

.info_content ul li:nth-child(2n+1) { clear:both; }
}
