@charset "utf-8";

@media only screen and (max-width:1204px) {

    .common_wide_box dl { position:absolute; left:0; top:50%; width:50%; margin:0 10px; transform: translate(0, -50%); }
    .common_wide_box dl.txt_right { padding-left:50%; margin:0; }
    .common_wide_box dl.txt_center { left:50%; top:0; width:1200px; padding-top:80px; transform: translate(-600px, -0%); text-align:center; }

    .solutions_module { padding:0 40px; }
    .feature_list > li { width:calc( 50% - 20px ); }
    .platform_app_list > li { width:calc( 33% - 12px ); }
    .solutions_product_list > li { width:calc( 25% - 15px ); }
    .using_scenario {  overflow-x:auto; }
	
	/* case study */
	.caseStudy_con{margin-bottom:12.46vw;}
	.case_study_top dt{width:calc( (100% - 1.33vw) / 2 ); margin-right:1.33vw; padding-bottom:1.99vw;}
	.case_study_top dt .img_wrap{height:36.30vw;}
	.case_study_top dt span{margin-top:2.49vw; font-size:1.33vw;}
	.case_study_top dt p{height:7.06vw; margin:1.41vw 0 2.08vw; font-size:1.99vw;}
	.case_study_top dt .btn_detail { width:14.45vw; height:3.49vw; line-height:3.32vw; font-size:1.33vw; border-radius:1.74vw; }
	.case_study_top dd{width:calc( (100% - 1.33vw) / 2 );}
	.case_study_list{margin-bottom:-1.41vw;}
	.case_study_list li{width:calc( (100% - 1.33vw) / 2 ); margin:0 1.33vw 1.41vw 0;}
	.case_study_list li .img_wrap{height:17.69vw;}
	.case_study_list li .txt{padding:1.66vw;}
	.case_study_list li .txt span{font-size:1.16vw;}
	.case_study_list li .txt p{height:3.49vw; margin-top:1.41vw; font-size:1.50vw;}

	.case_study_bottom{margin-top:1.66vw;}
	.case_study_bottom .case_study_list li{width:calc( (100% - 3.99vw) / 4 );}
	.case_study_bottom .case_study_list li:nth-of-type(2n){margin-right:1.33vw;}
	.case_study_bottom .case_study_list li:nth-of-type(4n){margin-right:0;}
	.case_study_bottom .more_wrap{margin-top:4.98vw;}
	.case_study_bottom .more_wrap img{width:6.64vw;}

	#common_table_view .detail_area > dl dt iframe{height:35.80vw;}

	.solutions_contents_wrap .case_study_list{margin:3.99vw 0 -1.41vw;}
	.solutions_contents_wrap .case_study_list li:nth-of-type(2n){margin-right:0;}
	.solutions_contents_wrap .case_study_list .seeAll{height:27.66vw; padding:2.49vw;}
	.solutions_contents_wrap .case_study_list .seeAll img{width:4.98vw; margin-bottom:2.08vw;}
	.solutions_contents_wrap .case_study_list .seeAll p{margin-bottom:4.57vw; font-size:1.33vw;}
	.solutions_contents_wrap .case_study_list .seeAll a{height:3.49vw; line-height:3.49vw; border-radius:1.74vw; font-size:1.33vw;}

	#suprema-integration .overview {padding:0 40px;}
}

@media only screen and (max-width:1024px) {

    /* 퀵링크메뉴 */
    #solutions_wrap .sticky-menu { display:none; }

    .path_indicator { display:none; }
	
	/* case study */
	.caseStudy_con{margin-top:8.33vw;}
	#common_table_view{margin-top:8.33vw;}
	#common_table_view .subject_area .btn_share { right:0; }
}

@media only screen and (max-width:890px) {
    .tooltip{display:block;}
    /* Sub Visual */
    .solutions_visual { height:162.77vw; }
    .solutions_visual.solutions_submain_visual { height:162.77vw; }
    .solutions_visual h2 { width:100%; font-size: 13.3vw; text-align:center;}
    .solutions_visual dl dt h1 { font-size: 13.3vw; }
    .solutions_visual dl dd h2 { font-size: 4.16vw; }
    .solutions_visual.solutions_submain_visual dl dt { font-size: 13.3vw; }
    .solutions_visual.solutions_submain_visual dl dd { font-size: 4.16vw; }

    .solutions_visual.access_control { background-position:30% 50%; }
    .solutions_visual.time_attendance { background-position:70% 50%; }
    .solutions_visual.mobile_credential { background-position:25% 50%; }
    .solutions_visual.facial_recognition { background-position:30% 50%; }
    .solutions_visual.biosign { background-position:30% 50%; }
    .solutions_visual.privacy_protection { background-position:30% 50%; }

    .solutions_submain h2 { font-size: 6.94vw; margin-top:9.72vw; }
    .solutions_submain_list { margin-top:4.86vw; padding:0 5.55vw; background-color:transparent; box-sizing:border-box; }
    .solutions_submain_list > li { width:50%; height:32.22vw; padding:0; background-color:#fff; border-right:1px solid #eee; border-bottom:1px solid #eee; }
    .solutions_submain_list > li:nth-child(2n) { border-right:0; }
    .solutions_submain_list > li:nth-child(5),
    .solutions_submain_list > li:nth-child(6) { border-bottom:0; }
    .solutions_submain_list > li::after { display:none; }
    .solutions_submain_list > li > a { font-size: 3.88vw; border-radius:0; padding-top:20.83vw; }
    .solutions_submain_list > li > a:hover { box-shadow:none; }
    #icon-construction { background-position:center 7.08vw; background-size:10.27vw 9.86vw; }
    #icon-datacenter { background-position:center 6.8vw; background-size:8.47vw 10.13vw; }
    #icon-health { background-position:center 7.5vw; background-size:9.58vw 7.63vw; }
    #icon-commercial { background-position:center 7.5vw; background-size:8.47vw 7.5vw; }
    #icon-infra { background-position:center 7.22vw; background-size:9.02vw 9.02vw; }
    #icon-manufacturing { background-position:center 7.22vw; background-size:9.44vw 9.44vw}

    #icon-access { background-position:center 7.08vw; background-size:7.63vw 9.3vw; }
    #icon-time { background-position:center 7.22vw; background-size:9.3vw 8.75vw; }
    #icon-mobile { background-position:center 6.94vw; background-size:5.97vw 9.72vw; }
    #icon-face { background-position:center 7.08vw; background-size:9.3vw 9.3vw; }
    #icon-biosign { background-position:center 7.08vw; background-size:5.97vw 9.72vw; }
    #icon-privacy { background-position:center 6.94vw; background-size:8.33vw 10vw; }


    /* 적용분야 : 공통 */
    .h3_title { font-size:5.823vw; padding:0 5.55vw; }
    .h4_title { font-size:6.94vw; }

    /* 통합 솔루션 */   
    .solutions_module .logo_thumnail:first-child, .solutions_module .logo_thumnail:nth-child(2){border-top:1px solid #ddd;}
    .solutions_module .logo_thumnail:nth-child(2n){border-left:0;}
    .solutions_module .logo_thumnail{width:49%; margin-right:0; height:29.1vw; margin-bottom:0; border-top:none;}
    .solutions_module .logo_thumnail .logo_popup{width:100%; height:100%; top:0; left:0; transform: translate(0,0);}
    .solutions_module .logo_thumnail .logo_pop_top{height:19.32vw;}
    .solutions_module .logo_thumnail .logo_pop_top p{left:5.55vw; font-size:5.55vw; line-height:3.82vw;}
    .solutions_module .logo_thumnail .logo_pop_top img{width:5.55vw; height:5.55vw; right:5.55vw;}
    .solutions_module .logo_thumnail .logo_pop_middle{padding: 0 5.55vw; height:100%; padding-bottom:19.32vw;}
    .solutions_module .logo_thumnail .logo_pop_middle .brochure_download{width:100%;}
    .solutions_module .logo_thumnail .logo_pop_middle .brochure_download .download{width:100%; height:10.03vw; line-height:10.03vw; border-radius:10.03vw; font-size:3.88vw; }
    .solutions_module .logo_thumnail .logo_pop_middle .brochure_download .download:first-child{margin-bottom:3.2vw;}
    .solutions_module .logo_thumnail .logo_pop_middle .logo_plan{border:0; padding:0; margin:0 0 7.63vw 0;}
    .solutions_module .logo_thumnail .logo_pop_middle .logo_plan img{margin: 9.72vw auto 9.72vw;}
    .solutions_module .logo_thumnail .logo_pop_middle .logo_plan p{margin-bottom:0; padding-bottom:8.3vw; border-bottom:1px solid #ddd; font-size:3.88vw; line-height:5.83vw;}
    .solutions_module .logo_thumnail .logo_pop_middle .logo_list li{font-size:3.88vw; line-height:7.2vw;}
    .solutions_module .logo_thumnail .logo_pop_middle .logo_text{margin:7.63vw 0 11.8vw 0; font-size:3.88vw; line-height:5.83vw;}
    .solutions_module .logo img{max-width:60%;}
    .solutions_module > p.all_solution_txt{font-size:5vw; line-height:6.94vw;}    

    .common_applications .text_area { line-height:5.83vw; padding:6.94vw 5.55vw; font-size:3.88vw; }
    .common_applications .text_area h3.h3_title { padding-left:0; margin-bottom:4.16vw;}
    .common_applications .text_area p { line-height:5.83vw; }

    /* 솔루션 특징 */
    .common_wide_box { position: relative; display:block; width:100%; padding:0 5.55vw; box-sizing: border-box;  }
    .common_wide_box dl { position:relative; left:auto; top:auto; width:100%; margin:0; padding-top:11.11vw; transform: translate(0,0); }
    .common_wide_box dl dt { margin:0 0 2.77vw; font-size:6.94vw; }
    .common_wide_box dl dd { line-height:5.83vw; font-size:3.88vw; }

    .common_wide_box dl.txt_white dt { color:#fff; }
    .common_wide_box dl.txt_white dd { color:#fff; opacity:0.7; }
    .common_wide_box dl.txt_right { padding-left:0; text-align: right; }
    .common_wide_box dl.txt_center { left:0; top:0; width:100%; max-width:1204px; padding-top:11.11vw; transform: translate(0, 0%); text-align:center; }

    .common_wide_box.bg01 { height:167vw; margin:4.16vw 0 0; background: url('../jpg/common_wide_box_bg01.jpg') no-repeat 50% bottom; background-size: contain; background-color:#ededed;}
    .common_wide_box.bg02 { height:116.66vw; margin:4.16vw 0 0; background: url('../jpg/common_wide_box_bg02-2.jpg') no-repeat 50% 50%; background-size: cover;}
    .common_wide_box.bg03 { height:155.27vw; margin:4.16vw 0 0; background: url('../jpg/mobile_credential_card-2.jpg') no-repeat 50% 50%; background-size: cover;}
    .common_wide_box.bg04 { height:155.83vw; margin:0 0 100px; background: url('../jpg/mobile_secure_information-2.jpg') no-repeat 50% 50%; background-size: cover;}
    .common_wide_box.bg05 { height:221.027vw; margin:4.16vw 0 0; background: url('../jpg/facial_recognition_sunlight-2.jpg') no-repeat 50% bottom; background-size: contain; background-color:#f7f7f7;}
    .common_wide_box.bg06 { height:119.44vw; margin:0 0 0; background: url('../jpg/lfd_live_face_detection-2.jpg') no-repeat 50% 50%; background-size: cover;}
    .common_wide_box.bg07 { height:266.38vw; margin:4.16vw 0 100px; background: url('../jpg/mobile_fingerprint_authentication_algorithm-2.jpg') no-repeat 50% 50%; background-size: cover;}

    /* 다양한 관리 기능 */
    .manage_funtion { margin-bottom:11.11vw; padding:11.11vw 0 0; background: #f8f8f8; }
    .manage_funtion .top_text { padding-top:20px; font-size:18px; color:#666; text-align:center; }
    .manage_funtion ul { padding:8.33vw 5.55vw 5.55vw; }
    .manage_funtion ul li { position:relative; float:none; width:100%; height:25vw; margin:0 0 5.55vw; }
    .manage_funtion ul li .icon_box { display:block; width:25vw; height:25vw; }
    .manage_funtion ul li .icon_box img { width:100%; }
    .manage_funtion ul li .text { position:absolute; left:33.33vw; line-height:normal; font-size:3.88vw; }


    /* 관련 정보 */
    .related_information { margin:5.55vw 0 13.8vw; padding:0 5.55vw; }
    .related_information li { float:none; width:100%; }
    .related_information li:first-child { margin-right:0; margin-bottom:4.16vw; }
    .related_information li a { display:block; height:27.7vw; line-height:27.7vw; padding-right:8.33vw; font-size:4.44vw; }
    .related_information li.bg06 a, .related_information li.bg07 a { display:block; height:27.7vw; font-size:3.8vw; line-height:5.5vw; }

    .related_information li.bg01 a { background-size: cover; }
    .related_information li.bg02 a { background-size: cover; }
    .related_information li.bg03 a { background-size: cover; }
    .related_information li.bg04 a { background-size: cover; }
    .related_information li.bg05 a { background-size: cover; }
    .related_information li.bg06 a { background-size: cover; }
    .related_information li.bg07 a { background-size: cover; }


    /* 적용분야 : 개인정보보호 */
    .privay_txt_box { display:block; padding:5.55vw 5.55vw 13.8vw; background: #f7f7f7; box-sizing:border-box; }
    .privay_txt_box .vertical_box { display:block; width:100%; height:auto; margin:11.11vw auto 0; }
    .privay_txt_box .vertical_box .icon_box { display:block; width:100%; height:30.55vw; text-align:center; }
    .privay_txt_box .vertical_box .icon_box > img { height:100%; }
    .privay_txt_box .vertical_box dl { display:block; width:100%; height:auto; padding:0 4.16vw; text-align:center; }
    .privay_txt_box .vertical_box dl dt { margin:8.33vw 0 2.77vw; font-size:5vw; }
    .privay_txt_box .vertical_box dl dd { font-size:3.88vw; }


    .solutions_module { margin-top:8.33vw; padding:0 5.55vw; box-sizing:border-box; }
    .solutions_sub_module { margin-top:4.16vw; }
    .solutions_module > p { font-size: 3.88vw; line-height:5.83vw;}
    .solutions_module .h3_title { padding:0; margin-bottom:4.16vw;}

    .solutions_list_box { width:100%; box-sizing:border-box; border:1px solid #ddd; padding:6.94vw 5.55vw; margin-top:2.77vw; }
    .solutions_list_box > ul { overflow:hidden; }
    .solutions_list_box > ul > li { width:100%; padding-left:3.47vw; background-position:left 2.65vw; background-size:1.38vw 1.38vw; font-size: 3.88vw; }

    .using_scenario { height:auto; text-align:center; margin-top:2.77vw; }
    .solutions_module > p.scenario_title { font-size: 4.44vw; margin:6.94vw 0 2.5vw; }
    .feature_list { margin-top:2.77vw; }
    .feature_list > li { width:100%; margin-right:0; margin-bottom:5.55vw; }
    .feature_list > li > p { font-size: 4.44vw; margin-top:4.16vw; }
    .feature_list > li > ul { margin-top:2.08vw; }
    .feature_list > li > ul > li { font-size: 3.88vw; padding-left:3.47vw; background-position:left 2.65vw; background-size:1.38vw 1.38vw;}
    .feature_list > li > ul > li > ul { padding-left:2.08vw; }

    .solutions_sub_module > h4 { font-size: 5vw; }
    .solutions_sub_module > ul { margin:2.77vw 0 5.55vw; }
    .platform_app_list > li { float:left; position:relative; width:100%; margin-right:0; margin-bottom:5.55vw; }
    .platform_app_list > li p { height:10.83vw; line-height:10.83vw; font-size: 4.44vw; }
    .platform_app_list > li p > span { width:1.66vw; height:2.77vw; background-size:100% 100%; margin-left:4.16vw; }
    .solutions_product_list { overflow-x:auto; white-space: nowrap;}
    .solutions_product_list > li { width:34vw; text-align:center; margin-bottom:7vw; margin-right:2.77vw; }
    .solutions_product_list > li:nth-child(4n) { margin-right:2.77vw; }
    .solutions_product_list > li div { width:100%; height:34vw; line-height:34vw; }
    .solutions_product_list > li div > img { vertical-align: middle; }
    .solutions_product_list > li p { font-size: 4.44vw;  }

    /*
    .solutions_product_list::-webkit-scrollbar { height:0.55vw; }
    .solutions_product_list::-webkit-scrollbar-track { background: #edecf1; }
    .solutions_product_list::-webkit-scrollbar-thumb { background: #a12944; }
    */
	
	/* case study */
	.case_study_visual{background-image:url('../jpg/bg_case_study-2.jpg');}
	.caseStudy_con{margin-bottom:20.83vw; padding:0 5.56vw;}
	.case_study_top dt{float:none; width:100%; margin:0 0 4.17vw 0; padding-bottom:8.33vw;}
	.case_study_top dt .img_wrap{height:32.36vw;}
	.case_study_top dt span{margin-top:2.78vw; font-size:3.47vw;}
	.case_study_top dt p{height:auto; margin:2.08vw 0 5.56vw; font-size:4.44vw; -ms-text-overflow:inherit; text-overflow:inherit; -webkit-line-clamp:inherit; -webkit-box-orient:inherit;}
	.case_study_top dt .btn_detail { width:100%; height:10.55vw; line-height:10.27vw; font-size:3.88vw; background: url('../png/icon-arrow-right_on_bold-2.png') no-repeat 90% center; background-size:1.527vw auto; border:0.27vw solid #a12642; border-radius:5.27vw; }
	.case_study_top dd{float:none; width:100%;}
	.case_study_list{margin-bottom:-4.17vw;}
	.case_study_list li{width:100%; margin:0 0 4.17vw 0; border:0; border-bottom:1px solid #f0f0f0;}
	.case_study_list li .img_wrap{height:32.36vw;}
	.case_study_list li .txt{padding:0 0 5.56vw;}
	.case_study_list li .txt span{margin-top:2.78vw; font-size:3.47vw;}
	.case_study_list li .txt p{height:auto; margin-top:2.08vw; font-size:4.44vw; -ms-text-overflow:inherit; text-overflow:inherit; -webkit-line-clamp:inherit; -webkit-box-orient:inherit;}

	.case_study_bottom{margin-top:4.17vw;}
	.case_study_bottom .case_study_list li{width:100%;}
	.case_study_bottom .case_study_list li:nth-of-type(2n){margin-right:0;}
	.case_study_bottom .more_wrap{margin-top:5.56vw;}
	.case_study_bottom .more_wrap img{width:13.89vw;}
	
	.solutions_contents_wrap .case_study_list{padding:0 5.55vw;}
	.solutions_contents_wrap .case_study_list li{background:transparent; border-color:#ddd;}
	.solutions_contents_wrap .case_study_list .seeAll{background:#fff; height:auto; padding:6.94vw; border-bottom:0;}
	.solutions_contents_wrap .case_study_list .seeAll img{width:8.33vw; margin-bottom:3.33vw;}
	.solutions_contents_wrap .case_study_list .seeAll p{margin-bottom:5.56vw; font-size:4.44vw;}
	.solutions_contents_wrap .case_study_list .seeAll a{height:10.56vw; line-height:10.56vw; border-radius:5.28vw; font-size:3.89vw;}

	#common_table_view { margin-top:13.89vw; padding:0 5.55vw; }
    #common_table_view .subject_area { padding:5.55vw 0; }
    #common_table_view .subject_area .subject { font-size:4.44vw; }
    #common_table_view .subject_area .date { margin-top:2.083vw; font-size:3.33vw; }
    #common_table_view .subject_area .titBtn_wrap {right:0; top:-9.03vw;}
	#common_table_view .subject_area .titBtn_wrap .downBtn{width:5.56vw; margin-right:2.78vw;}
	#common_table_view .subject_area .titBtn_wrap .btn_share{width:4.58vw;}
    #common_table_view .subject_area .share_area { right:0; top:100%; width:25vw; margin-top:1px; }
    #common_table_view .subject_area .share_area:after { display:block; content:''; clear:both; }
    #common_table_view .subject_area .share_area a { display:block; float:left; width:25%; }
	#common_table_view .detail_area > dl dt{float:none; width:100%;}
	#common_table_view .detail_area > dl dt iframe{height:50vw;}
    #common_table_view .detail_area { padding:5.55vw 0; }
    #common_table_view .detail_area .text_area { padding:1.67vw 0; font-size:3.88vw; }
	#common_table_view .detail_area .text_area p + p { margin-top:4.86vw; }
	#common_table_view .detail_area .text_area strong{margin-bottom:2.78vw;}
	#common_table_view .detail_area > dl{margin-bottom:6.94vw;}
	#common_table_view .detail_area > dl dd{float:none; width:100%; padding:6.94vw 2.78vw; margin-left:0;}
	#common_table_view .detail_area > dl dd > strong{font-size:4.44vw; padding:0 2.78vw;}
	#common_table_view .detail_area > dl dd ul{margin-top:5.56vw;}
	#common_table_view .detail_area > dl dd ul li{margin-bottom:4.86vw; padding:0 2.78vw 4.86vw;}
	#common_table_view .detail_area > dl dd ul li span{font-size:3.89vw;}
	#common_table_view.caseStudy_view .detail_area > dl dd ul li span{font-size:3.89vw;}
	#common_table_view .detail_area > dl dd ul li p{margin-top:1.39vw; font-size:3.89vw; line-height:1.3;}
	#common_table_view .detail_area .detail_system{margin-bottom:6.39vw;}
	#common_table_view .detail_area h3{margin-bottom:4.17vw; font-size:6.39vw;}
	.solutions_sub_module .swiper-container .swiper-button-prev {display:none;}
	.solutions_sub_module .swiper-container .swiper-button-next {display:none;}	

	/* 게시판 형태 */
    #board_wrapper .board_containe { border-bottom:none; }
    #board_wrapper .board_containe ul > li { position:relative; display:block; padding:1.38vw 0 2.083vw; }
    #board_wrapper .board_containe ul > li:last-child { border-bottom:1px solid #ddd; }
    #board_wrapper .board_containe ul > li > .tb-cell { display:inline-block; }
	#board_wrapper .board_containe ul > li > .cate {position: absolute; left: 21%; top: 15px; width: auto; text-align: left; font-size: 4.44vw;}
	#board_wrapper .board_containe ul > li > .down a.btn_down {height: 10.55vw; line-height: 10.55vw; font-size: 3.88vw; border-radius: 5.27vw; margin-right:0; margin-top:1vw;}
	#board_wrapper.pkg_board .board_containe ul > li > .cate{width:auto; left:auto;}
    #board_wrapper.pkg_board .board_containe ul > li > .subject{width:85%;}
    #board_wrapper.pkg_board .board_containe ul > li > .down{width:100%;}
    #board_wrapper.pkg_board .board_containe ul > li > .subject{padding-top:13.33vw;}
	#board_wrapper .board_btn_area .btn_list {display: block; width: 100%; line-height: 10.55vw; font-size: 3.88vw; border-radius: 5.27vw;}
	/* 2020-07-01 */
}
