@charset "utf-8";

/* 내용관리 */
#ctt {margin:10px 0;padding:20px 0;background:#fff}
.ctt_admin {text-align:right}
#ctt header h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#ctt_con {padding:10px 0;line-height:1.6em;position:relative;}
#ctt_con img{max-width:100%;height:auto}
.ctt_img {text-align:center}

/* 내용관리 CSS 정의는 여기에 ~~ */

/* 회사개요 */
.office_pic_box{position:relative;overflow:hidden;}
.office_pic_box .office_text_box{position:absolute;bottom:0;left:0;box-sizing:border-box;background-color:rgba(0,0,0,.6);color:#fff;padding:0.5rem 1rem;text-align:center;width:100%;}



/* CEO인사말 */
.cnt_top{position:relative;background-repeat:no-repeat;background-position:center center; background-size:cover;height:300px;}
/* content 마다 bg_xxx 형식으로 추가 하여 이미지 경로만 추가 */
/* 이미지 경로는 /설치디렉토리/skin/content/basic/img/ -> 아래 처럼 ./img/ 경로 임 */
.cnt_top.bg_ceo{background-image:url(./img/ceo_bg.jpg);}
.cnt_top.bg_labo{background-image:url(./img/labo_bg.jpg);}

.cnt_slogun {color:#fff;text-shadow: 2px 2px 1px rgba(0,0,0,.6), 0px 0px 2px #000;}
.cnt_slogun.tx_ceo{position:absolute;right:1rem; bottom:35%;padding:4rem 3rem 3rem 3rem;transition:all 0.5s;}
.cnt_slogun.tx_ceo h2 {font-size:calc(1rem + 0.5vw);margin-bottom:1rem;position:relative;}
.cnt_slogun.tx_ceo h2:before{content:'\275D';font-size:calc(2rem + 1vw);color:#3074a9;position:absolute;top:-2rem;left:-1.6rem}
.cnt_slogun.tx_ceo h3 {font-size:calc(.75rem + 0.3vw);font-weight:normal;margin-bottom:.75rem;}
.cnt_slogun.tx_ceo p {font-size:calc(.75rem + 0.2vw);}

.ceo_head_box {background-color:#fff;position:absolute;width:50%;padding:2rem 0 0 1rem;bottom:0;height:120px;font-size:calc(1rem + 0.35vw);line-height:160%;color:#216395;transition:all 0.5s;}

.tx_para {padding:2rem 1rem;}
.tx_para p {line-height:160%; margin-bottom:1rem;}

.cnt_para {padding:0.2rem 0rem;}
.cnt_para p {line-height:160%; margin-bottom:1rem;}

.ceo_greetings{font-size:calc(0.85rem + 0.3vw);}


.qui_text{font-size:1.1rem;}
.qui_text p {line-height:1.6em;text-align:center;}

.hex_wrap {margin:3rem auto;}
.bg_hex {background-image:url(./img/bg_hex.gif);background-repeat:no-repeat;background-size:contain;background-position:center center;}


.hex_text_grp {position:absolute;height:100%;width:100%;}
.hex_text_grp .hex_head{position:relative;height:23%;}
.hex_text_grp .hex_mid{position:relative;height:48%;}
.hex_text_grp .hex_foot{position:relative;height:29%;}

.hex_text_grp .hex_head h3{font-size:1.8rem;position:absolute;text-align:center;top:50%;left:50%;transform:translate(-50%,-50%);line-height:1.5em;}

.hex_text_grp .hex_mid .hex_box{max-width:90%;position:relative;height:100%;background-color:#fff;border:1px solid #dcdcdc;border-radius:1.5rem;min-height:300px;box-shadow:5px 5px 7px rgba(0,0,0,.3);margin: 0 auto;}
.hex_text_grp .hex_mid .hex_box .hex_pos{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;text-align:center;}
.hex_text_grp .hex_mid .hex_box .hex_pos h4{font-size: 1.25rem;text-align:center;display:block;position:relative;color:#333232;}
.hex_text_grp .hex_mid .hex_box .hex_pos h4::after{content:'';display:block;height:1px;width:28px;background-color:#333232;margin:1rem auto;}

.hex_text_grp .hex_mid .hex_box p {text-align:center;line-height: 130%;font-size: 0.95em;}

.hex_text_grp .hex_foot .hex_foot_text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.hex_text_grp .hex_foot p{font-size:1.26rem;text-align:center;}



.img_block_box{position:relative;overflow:hidden;border:1px solid #dcdcdc;}
.img_block_box > h4 {font-weight:normal;position:absolute;background-color:rgba(0,0,0,.75);color:#fff; text-align:center;left:0;bottom:0;z-index:1;width:100%;padding:0.3rem 0.5rem;}



.cnt_won_outer{position:relative;display:inline-block;margin:5rem 0 1rem 0;}
.cnt_won_inner{position:relative;width:273px;height:273px;background-color:#e3e6ec;border-radius:50%;border:4px solid #2d417e;vertical-align:middle;display:inline-block;transition:all 0.5s;}
.cnt_won_inner:before{content:'';position:absolute;width:75%;height:75%;background-color:#fff;vertical-align:middle;display:inline-block;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);}
.cnt_won_inner > h3{font-size:calc(2rem + 1vw); position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#314369;font-weight:600;}
.cnt_won {position:absolute;width:44%;height:44%;border-radius:50%;z-index:1;color:#fff;}
.cnt_won > div{position:relative;width:100%;height:100%;}
.cnt_won > div > h4{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size: calc(1rem + 0.3vw);text-transform: capitalize;}
.cnt_won1{background-color:#4598d8;top:-18.5%;left:50%;transform:translateX(-50%);}
.cnt_won2{background-color:#7cc0f4;bottom:5.6%;left:-18%;}
.cnt_won3{background-color:#a199ec;bottom:5.6%;right:-22%;}
.cnt_caution_box{margin-top:2rem; padding:2rem 3.6rem;clear:both;border-radius:1.2rem;border:2px solid #dcdcdc;background-color:#fafafa;}
.ol_custom{font-size: 1.15rem;font-weight:300;}
.ol_custom > li {padding:0.4rem 1rem; position:relative;}
.ol_custom > li:before{position:absolute;margin-right:1rem;color:#2041ab;font-weight:600;left:-1rem;}
.ol_custom > li:nth-child(1):before{content:'1.';}
.ol_custom > li:nth-child(2):before{content:'2.';}
.ol_custom > li:nth-child(3):before{content:'3.';}
.ol_custom > li:nth-child(4):before{content:'4.';}
.ol_custom > li:nth-child(5):before{content:'5.';}
.ol_custom > li:nth-child(6):before{content:'6.';}
.ol_custom > li:nth-child(7):before{content:'7.';}


.qui_ste_box {position:relative;margin:4rem 0;}
/*.qui_step_won {width:210px;height:210px;position:relative;background-color:#213b74;border-radius:50%;}*/
/*.qui_step:nth-child(even) .qui_step_won {background-color:#4598d8;}*/
/*.qui_step_won:before{content:'';position:absolute;display:block;width:75%;height:75%;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;*/
/*background: #ffffff;*/
/*background: -moz-radial-gradient(center, ellipse cover,  #ffffff 0%, #d3d3d3 100%);*/
/*background: -webkit-radial-gradient(center, ellipse cover,  #ffffff 0%,#d3d3d3 100%);*/
/*background: radial-gradient(ellipse at center,  #ffffff 0%,#d3d3d3 100%);*/
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d3d3',GradientType=1 );*/
/*}*/
.qui_step_won{position:relative;max-width:233px;margin:0 auto;margin-bottom:1.5rem;}
.qui_step_won img {display:block;width:100%;max-width:233px;}
.qui_step_won > h3{font-size:calc(0.6rem + 0.6vw);color:#213b74;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;text-align:center;}
.qui_step:nth-child(even) .qui_step_won > h3 {color:#0d6c9a;}
.qui_step_text{background-color:#d4dff6;box-sizing:border-box;padding:1rem;border-radius:0.8rem;}
.qui_step:nth-child(even) .qui_step_text{background-color:#efefef;}
.qui_step_text > ul {padding-left:1rem;}
.qui_step_text > ul > li {color:#444;font-size:calc(1rem + 0.1vw);position:relative;padding-left:0.5rem;}
.qui_step_text > ul > li:before {content:'';width:4px;height:4px;top: 0.9em;left:-0.25rem;background-color:#4598d8;display:block;position:absolute;}



.cnt3C_wrap{position:relative;font-size:0;margin:1.5rem auto;text-align:center;}
.cnt3C_wrap .cnt3C{position:relative;font-size:1rem;}
.cnt3C_wrap .cnt3C .won{position:relative;width: 215px;height: 215px;border-radius:50%;color:#fff;margin: 0 auto;transition:all 0.5s;}
.cnt3C_wrap .cnt3C .won1{background-color:#4598d8}
.cnt3C_wrap .cnt3C .won2{background-color:#7cc0f4}
.cnt3C_wrap .cnt3C .won3{background-color:#a199ec}
.cnt3C_wrap .cnt3C .won .won_text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;}
.cnt3C_wrap .cnt3C .won .won_text > h4{text-transform:uppercase;font-size:calc(1.1rem + 0.45vw);}
.cnt3C_wrap .cnt3C .won .won_text > h4 > span{font-size:calc(1.5rem + 0.45vw);}
.cnt3C_wrap .cnt3C{display:inline-block;width: 27.33%;box-sizing:border-box;padding:1rem;vertical-align:top;position: relative;}
.cnt3C_wrap .cnt3C .cnt3C_txt{text-align:center;padding:2rem 0 1rem 0;}
.cnt3C_wrap .cnt3C .cnt3C_txt > h4{font-size:calc(1.2rem + 0.45vw);}
.cnt3C_wrap .cnt3C .cnt3C_txt > p {font-size:calc(0.7rem + 0.35vw); margin-top:2rem;}
.cnt3C_wrap .cnt3C::after{content:'\f2c7';font-family:'Ionicons',sans-serif;font-size:2rem;display:inline-block;box-sizing:border-box;color:#9b9b9b;vertical-align: top;padding: 1rem;position: absolute;width: 8%;top: calc(215px/2);right: -4px;text-align: center;transition:all 0.5s;}
.cnt3C_wrap .cnt3C:last-child::after{content:'';display:none;}

.req_wrap {padding:2rem;position:relative;}
.req_wrap::before {content:'';width:25%;position:absolute;height:2px;background-color:#176bc1;z-index:1;left:0;top:-2px;}
.req_wrap::after {content:'';width:100%;position:absolute;height:2px;background-color:#dadada;left:0;top:-2px}
.req_wrap{background-repeat:no-repeat;background-position:20% 90%;}
.req_wrap.req_bg1{background-image:url(./img/icon_reqbox1.png);}
.req_wrap.req_bg2{background-image:url(./img/icon_reqbox2.png);}
.req_wrap.req_bg3{background-image:url(./img/icon_reqbox3.gif);}
.req_wrap.req_bg4{background-image:url(./img/icon_reqbox4.gif);}
.req_wrap.req_bg5{background-image:url(./img/icon_reqbox5.gif);}
.req_wrap.req_bg6{background-image:url(./img/icon_reqbox6.gif);}
.req_wrap.req_bg7{background-image:url(./img/icon_reqbox7.gif);}
.req_wrap.req_bg8{background-image:url(./img/icon_reqbox8.gif);}

.req_wrap .reqbox h4 {font-size:1.6rem;}
.req_wrap .grid-row > div:last-child li{position:relative;padding-left:1rem;margin-bottom:0.5rem;font-size:1.1rem;}
.req_wrap .grid-row > div:last-child li:before {content:'';position:absolute;display:block;width:4px;height:4px;background-color:#176bc1;left:4px;top:calc(1rem - 4px);}

.map-box {-webkit-box-sizing:border-box;box-sizing:border-box; border:1px solid #ddd; padding:.3rem;}
.map_marker {background-color:#fff; font-weight:normal;font-size:1rem;padding:0.3rem 1rem;border:1px solid #dcdcdc;box-sizing:border-box;}
.map_marker:after{content:'';height:16px;width:32px;background-color:#ccc;display:block;position:absolute;left:calc(50% - 12px);bottom:-15px;background:url(./img/marker_arrow.png) no-repeat center bottom;}

#page_kakao_map, #page_kakao_map2 {height:500px;width:100%;}
#kakao_map, #kakao_map2 {width:100%;height:100%;}

@media all and (max-width:1184px){
	.cnt3C_wrap .cnt3C .won{width:210px;height:210px;}
	.cnt3C_wrap .cnt3C::after{top:calc(210px/2);}
}
@media all and (max-width:960px){
	.ceo_head_box{bottom:0px;width:100%;bottom:-120px;}
	.tx_para{padding-top:calc(1rem + 120px)}
	.cnt3C_wrap .cnt3C .won{width:184px;height:184px;}
	.cnt3C_wrap .cnt3C::after{top:calc(184px/2);}
	.scroll_wrap {position:relative;overflow:hidden;}
	.scroll_box {max-width:100%;overflow-y:hidden;overflow-x:scroll;position:relative;}
	.scroll_box .scroll_area{width:960px;}
	.scroll_wrap:after {
		position:absolute;
		top:0;
		left:100%;
		width:50px;
		height:100%;
		border-radius:10px 0 0 10px / 50% 0 0 50%;
		box-shadow:-5px 0 10px rgba(0, 0, 0, 0.25);
		content:'';
	}
}
@media all and (max-width:880px){
	.cnt3C_wrap .cnt3C .won{width:170px;height:170px;}
	.cnt3C_wrap .cnt3C::after{top:calc(150px/2);}
}
@media all and (max-width:768px){
	.qui_text p{font-size:1.2rem;}
	.hex_wrap{padding-bottom:5rem;}
	.hex_text_grp .hex_mid {height:73%;}
	.hex_text_grp .hex_foot{position:relative;height:auto;}
	.hex_text_grp .hex_head h3{font-size:calc(1.5rem + 0.5vw)}
	.hex_text_grp .hex_mid .hex_box{max-width:100%;position:relative;background-color:#fff;border:1px solid #dcdcdc;border-radius:1.5rem;min-height:100px;box-shadow:5px 5px 7px rgba(0,0,0,.3);padding:1rem 0;}
	.hex_text_grp .hex_mid .hex_box .hex_pos{text-align:left;}
	.hex_text_grp .hex_mid .hex_box .hex_pos img{}
	.hex_text_grp .hex_mid .hex_box .hex_pos h4{display:inline-block;text-align:left;}
	.hex_text_grp .hex_mid .hex_box .hex_pos h4::after{content:none;}
	.hex_text_grp .hex_mid .hex_box .hex_pos p{text-align:left;line-height:120%;}
	.hex_text_grp .hex_foot .hex_foot_text{position:relative;top:0;left:0;transform:none;padding:1rem 0;}
	.hex_text_grp .hex_foot p {font-size:1rem;}
	
	
	.cnt3C_wrap .cnt3C{display:block;width:100%;text-align:left;}
	.cnt3C_wrap .cnt3C .won{width:150px;height:150px;display:inline-block;vertical-align:top;}
	.cnt3C_wrap .cnt3C .cnt3C_txt{display:inline-block;vertical-align:top;width:calc(95% - 150px);text-align:left;padding-left:1rem;}
	.cnt3C_wrap .cnt3C .cnt3C_txt > h4{padding:0;}
	.cnt3C_wrap .cnt3C .cnt3C_txt > p{padding:0;margin-top:1rem;line-height:1.25rem;}
	.cnt3C_wrap .cnt3C::after{content:'';display:none;}
	.cnt3C_wrap .cnt3C .won .won_text > img {width:40px}
	.cnt3C_wrap .cnt3C .won .won_text > h4 > span {font-size:1.15rem;}
	.cnt3C_wrap .cnt3C .won .won_text > h4 {font-size:1rem;}
	.cnt3C_wrap .cnt3C .won::after{content:'\f2c7';font-family:'Ionicons',sans-serif;font-size:2rem;color:#9b9b9b;position:absolute;bottom:-1.6rem;left:calc( 150px/2 - 0.8rem)}
	.cnt3C_wrap .cnt3C:last-child .won::after{content:'';display:none;}

	.req_wrap .grid-row > div:last-child li{font-size:1rem;}

	.req_wrap{padding:1rem 0.5rem;background-repeat:no-repeat;background-position:90% 5px;}
	.req_wrap .grid-row > div:last-child{margin-top:0.5rem;}

	.cnt_slogun.tx_ceo{bottom:10%;}
}
@media all and (max-width:640px){
	#page_kakao_map, #page_kakao_map2 {height:350px !important;}
	.cnt_won_inner{width:300px;height:300px;}
	.cnt_caution_box{padding:1rem 1rem 1rem 2rem;}
	
	.cnt3C_wrap .cnt3C .won{width:124px;height:124px;display:inline-block;vertical-align:top;}
	.cnt3C_wrap .cnt3C .cnt3C_txt{display:inline-block;vertical-align:top;width:calc(95% - 124px);text-align:left;padding-left:1rem;padding-top:1rem;}
	.cnt3C_wrap .cnt3C .cnt3C_txt > p{padding:0;margin-top:1rem;line-height:1.25rem;}
	.cnt3C_wrap .cnt3C .won .won_text > img {width:40px}
	.cnt3C_wrap .cnt3C .won .won_text > h4 > span {font-size:.85rem;}
	.cnt3C_wrap .cnt3C .won .won_text > h4 {font-size:.75rem;}
	.cnt3C_wrap .cnt3C .won::after{content:'\f2c7';font-family:'Ionicons',sans-serif;font-size:2rem;color:#9b9b9b;position:absolute;bottom:-1.6rem;left:calc( 124px/2 - 0.8rem)}
	.cnt3C_wrap .cnt3C:last-child .won::after{content:'';display:none;}
}
@media all and (max-width:480px) {
	#page_kakao_map,#page_kakao_map2 {height:280px !important;}
	.cnt_slogun.tx_ceo{width:100%;bottom:0;right:0;left:0;padding:1.6rem;}
	.cnt_slogun.tx_ceo h2{padding-top:1rem;}
	.cnt_slogun.tx_ceo h2:before{font-size:2rem;top:-.5rem;left:0;}
	.cnt_slogun.tx_ceo h3{margin-top:0.5rem;}
	.cnt_top{height:397px;}
	 .qui_text p{font-size:1rem;}
	.hex_wrap{padding-bottom:5rem;}
	.hex_text_grp .hex_mid {height:73%;}
	.hex_text_grp .hex_foot{position:relative;height:auto;}
	.hex_text_grp .hex_head h3{font-size:calc(1.1rem + 0.3vw);width:100%;text-align:center;}
	.hex_text_grp .hex_mid .hex_box{padding:0.5rem 0;min-height:80px;}
	.hex_text_grp .hex_mid .hex_box .hex_pos{text-align:left;}
	.hex_text_grp .hex_mid .hex_box .hex_pos img{}
	.hex_text_grp .hex_mid .hex_box .hex_pos h4{display:inline-block;text-align:left;font-size:1rem;}
	.hex_text_grp .hex_mid .hex_box .hex_pos h4::after{content:none;}
	.hex_text_grp .hex_mid .hex_box .hex_pos p{text-align:left;line-height:120%;font-size:0.85rem;}
	.hex_text_grp .hex_foot .hex_foot_text{position:relative;top:0;left:0;transform:none;padding:1rem 0;}
	.hex_text_grp .hex_foot p {font-size:0.85rem;line-height:1.3em;}
	.cnt_won_inner{width:260px;height:260px;}
	.qui_step {margin-top:1.25rem;}
	.qui_step:first-child {margin-top:0rem;}
	.qui_step_won{margin-bottom:0.5rem;}
	.qui_step_won > h3{font-size:1rem;}
	
	.cnt3C_wrap {margin:1rem 0;}
	.cnt3C_wrap .cnt3C .won{width:96px;height:96px;display:inline-block;vertical-align:top;}
	.cnt3C_wrap .cnt3C .cnt3C_txt{display:inline-block;vertical-align:top;width:calc(95% - 96px);text-align:left;padding-left:1rem;padding-top:1rem;}
	.cnt3C_wrap .cnt3C .cnt3C_txt > p{padding:0;margin-top:1rem;line-height:1.25rem;}
	.cnt3C_wrap .cnt3C .won .won_text > img {width:40px}
	.cnt3C_wrap .cnt3C .won .won_text > h4 > span {font-size:.85rem;}
	.cnt3C_wrap .cnt3C .won .won_text > h4 {font-size:.7rem;}
	.cnt3C_wrap .cnt3C .won::after{content:'\f2c7';font-family:'Ionicons',sans-serif;font-size:2rem;color:#9b9b9b;position:absolute;bottom:-1.6rem;left:calc( 96px/2 - 0.8rem)}
	.cnt3C_wrap .cnt3C:last-child .won::after{content:'';display:none;}

	.req_wrap .grid-row > div:last-child li{font-size:.85rem;}

	.ctt_company .two_col_tbl th{display:block;width:100%;border:0 !important; text-align:left; background-color:#fff;padding:0.3rem 1rem 0 1rem}
	.ctt_company .two_col_tbl th br{display:none;}
	.ctt_company .two_col_tbl td{display:block;width:100%;border-width:0 0 1px 0px !important; background-color:#fff;padding:0rem 1rem 0.3rem 1rem}
	.ctt_company .two_col_tbl td:last-child{border-right:1px solid #dcdcdc;}
}
@media all and (max-width:375px) {
	.cnt3C_wrap {margin:1rem 0;}
	.cnt3C_wrap .cnt3C{padding:.75rem 0;margin:0;}
	.cnt3C_wrap .cnt3C .won{width:96px;height:96px;display:inline-block;vertical-align:top;}
	.cnt3C_wrap .cnt3C .won .won_text > img {width:40px}
	.cnt3C_wrap .cnt3C .won .won_text > h4 > span {font-size:.85rem;margin:0;padding:0;}
	.cnt3C_wrap .cnt3C .won .won_text > h4 {font-size:.7rem;padding: 0;line-height: 1;}
	.cnt3C_wrap .cnt3C .won::after{content:'\f2c7';font-family:'Ionicons',sans-serif;font-size:2rem;color:#9b9b9b;position:absolute;bottom:-1.6rem;left:calc( 96px/2 - 0.8rem)}
	.cnt3C_wrap .cnt3C:last-child .won::after{content:'';display:none;}
	.cnt3C_wrap .cnt3C .cnt3C_txt{display:inline-block;vertical-align:top;width:calc(95% - 96px);text-align:left;padding-left:1rem;padding-top:1rem;}
	.cnt3C_wrap .cnt3C .cnt3C_txt > p{padding:0;margin-top:0rem;line-height:1rem;}
}