/*header*/
.header{position:relative!important}
#container_title{display:none}

/*서브 공통*/
.header .header_inner .main_menu li.header_active a{color:#214ba0; font-weight:900}
.mobile_menu{top:40px!important}

.sub_visual{padding:85px 0}
.sub_visual.company{background:url('/img/main/company_back.jpg') no-repeat center; background-size:cover}
.sub_visual.business{background:url('/img/main/business_back.jpg') no-repeat center; background-size:cover}
.sub_visual.community{background:url('/img/main/community_back.jpg') no-repeat center; background-size:cover}
.sub_visual.midascm{background:url('/img/sub/midascm_visual.jpg') no-repeat center; background-size:cover}


.sub_visual h1{color:#fff; text-align:center; font-size:50px; font-weight:800; line-height:1.4em}
.sub_visual ul{text-align:center}
.sub_visual ul li{display:inline-block; padding:0 2px}
.sub_visual ul li,.sub_visual ul li a{font-size:15px; font-weight:400; color:#fff}

.sub_menu{background:#16479e}
.sub_menu ul{display:flex; flex-direction:row; flex-wrap:nowrap; position:relative}
.sub_menu ul:before{content:''; width:1px; height:100%; background:rgba(255,255,255,0.2); position:absolute; left:0; top:0}
.sub_menu ul:after{content:''; width:1px; height:100%; background:rgba(255,255,255,0.2); position:absolute; right:0; top:0}
.sub_menu ul li{height:60px; position:relative}
.sub_menu ul li:hover{background:rgba(255,255,255,0.1)}
.sub_menu ul li + li:after{content:''; width:1px; height:100%; background:rgba(255,255,255,0.2); position:absolute; left:0; top:0}
.sub_menu.col_4 ul li{width:25%}
.sub_menu.col_2 ul li{width:50%}
.sub_menu.col_3 ul li{width:33.3333%}
.sub_menu ul li a{display:block; width:100%; height:100%; display:table}
.sub_menu ul li a span{color:#fff; display:table-cell; vertical-align:middle; text-align:center; font-size:17px; font-weight:400}

.sub_menu ul li.sub_active{background:#fff}
.sub_menu ul li.sub_active a span{color:#222}

.sub_section{padding:100px 0}
.sub_section h2{font-size:35px; color:#222; font-weight:800; text-align:center; padding-bottom:60px}

/*인사말*/
.greeting{background:url('/img/sub/greeting_back_grey.jpg') repeat-x; background-position:bottom; position:relative}
.greeting .greeting_back{position:relative}
.greeting .greeting_back:before{content:''; position:absolute; width:50%; min-height:555px; background:#16469e url('/img/sub/greeting_back_blue.jpg') no-repeat center; background-size:cover; left:0; top:50px}
.greeting .greeting_back .greeting_back_inner{display:flex; flex-direction:row; flex-wrap:nowrap}
.greeting .greeting_back .greeting_back_inner > div{width:50%; position:relative}
.greeting .greeting_back .greeting_back_inner > div + div{padding-left:50px}
.greeting .greeting_back .greeting_back_inner > div img{max-width:550px; width:92%}
.greeting .greeting_back .greeting_back_inner > div img.greeting_m{display:none}
.greeting .greeting_back .greeting_back_inner > div h3{padding-top:50px; font-size:35px; color:#222; font-weight:300; letter-spacing:-2.5px; line-height:1.4em}
.greeting .greeting_back .greeting_back_inner > div h3 strong{font-weight:800; color:#16469e}
.greeting .greeting_back .greeting_back_inner > div h3:after{content:''; display:block; width:1px; height:40px; background:#000; margin:24px 0 24px 10px}
.greeting .greeting_back .greeting_back_inner > div p{font-size:18px; color:#222; font-weight:400; letter-spacing:-1px; line-height:1.6em}
.greeting .greeting_back .greeting_back_inner > div p + p{padding-top:35px}

.greeting .greeting_back .greeting_back_inner > div p span{float: right; font-size: 20px; font-weight: 600;}
/*연혁*/
.history h2{padding-bottom:50px}
.history .history_wrap{padding-bottom:50px; position:relative}
.history .history_wrap .history_img_holder{position:absolute; width:23.25%; left:22%; top:-3px}
.history .history_wrap .history_img_holder img{width:100%}
.history .history_wrap .history_img_holder.right_holder{left:auto; right:22%}

.history .history_wrap.last_wrap{padding-bottom:0}
.history .history_wrap .history_inner{display:flex; flex-flow:row wrap}
.history .history_wrap .history_inner > div{width:50%; position:relative; padding-bottom:30px}
.history .history_wrap .history_inner > div.last{padding-bottom:0}
.history .history_wrap .history_inner > div h3{font-size:23px; color:#16469e; font-weight:800; padding-bottom:5px; position:relative}
.history .history_wrap .history_inner > div p{font-size:18px; font-weight:400; color:#222; position:relative}
.history .history_wrap .history_inner > div p + p{padding-top:8px}
.history .history_wrap .history_inner > div p.no_dot:before{display:none}

.history .history_wrap .history_inner.right{justify-content:flex-end}
.history .history_wrap .history_inner.right > div{padding-left:40px}
.history .history_wrap .history_inner.right > div:before{content:''; width:1px; height:100%; background:#eee; position:absolute; left:0; top:0}
.history .history_wrap .history_inner.right > div h3:before{content:''; width:27px; height:27px; background:url('/img/sub/history_dot.png') no-repeat center; background-size:cover; position:absolute; top:3px; left:-53px}
.history .history_wrap .history_inner.right > div p:before{content:''; position:absolute; width:11px; height:11px; background:#ccc; border-radius:11px; left:-45px; bottom:-5px; z-index:1}
.history .history_wrap .history_inner.left{justify-content:flex-start}
.history .history_wrap .history_inner.left > div{text-align:right; padding-right:40px}
.history .history_wrap .history_inner.left > div:before{content:''; width:1px; height:100%; background:#eee; position:absolute; right:0; top:0}
.history .history_wrap .history_inner.left > div h3:before{content:''; width:27px; height:27px; background:url('/img/sub/history_dot.png') no-repeat center; background-size:cover; position:absolute; top:3px; right:-53px}
.history .history_wrap .history_inner.left > div p:before{content:''; position:absolute; width:11px; height:11px; background:#ccc; border-radius:11px; right:-45px; bottom:-5px; z-index:1}

.history .history_wrap .history_inner.right > div p.hide_line:after{content:''; width:1px; height:100%; background:#fff; position:absolute; left:-40px; top:0}
.history .history_wrap .history_inner.left > div p.hide_line:after{content:''; width:1px; height:100%; background:#fff; position:absolute; right:-40px; top:0}


/*조직도*/
.organization .organization_inner img.pc_img{max-width:1200px; width:100%}
.organization .organization_inner img.m_img{max-width:767px; width:100%; display:none}

/*오시는 길*/
.contact .contact_inner ul{text-align:center; padding:50px 0 110px}
.contact .contact_inner ul li{display:inline-block; text-align:left; position:relative}
.contact .contact_inner ul li + li{margin-left:80px}
.contact .contact_inner ul li span{font-size:18px; color:#222; font-weight:500; padding-left:12px; display:block}
.contact .contact_inner ul li span.label{font-size:18px; color:#fff; font-weight:500; background:#16479e; border-radius:5px; padding:6px 12px; position:absolute; left:0; top:-4px}
.contact .contact_inner ul li:first-child span + span{padding-left:65px}
.contact .contact_inner ul li:nth-child(2) span + span{padding-left:100px}
.contact .contact_inner ul li:last-child span + span{padding-left:65px}

/*마이다스씨엠*/
.greeting.reverse{padding:100px 0 140px}
.greeting.reverse .greeting_back:before{left:auto; right:0; top:0; background:#16469e url('/img/sub/midascm_back_blue.jpg') no-repeat center; background-size:cover}
.greeting.reverse .greeting_back .greeting_back_inner > div{padding-right:50px}
.greeting.reverse .greeting_back .greeting_back_inner > div + div{padding-left:50px; padding-right:0; padding-top:50px}
.greeting.reverse .greeting_back .greeting_back_inner > div img{width:100%}


/*****미디어쿼리*****/
@media screen and (max-width: 1920px) {
	/*인사말*/
	.greeting .greeting_back:before{background-position-x:-30px}
}

@media screen and (max-width: 1200px) {
	/*인사말*/
	.greeting .greeting_back:before{min-height:525px}
	.greeting .greeting_back .greeting_back_inner > div + div{padding-left:3.5%}
	.greeting .greeting_back .greeting_back_inner > div p{font-size:17.5px}

	/*오시는 길*/
	.contact .contact_inner ul li + li{margin-left:50px}

	/*마이다스씨엠*/
	.greeting.reverse .greeting_back .greeting_back_inner > div{padding-right:3.5%}
	.greeting.reverse .greeting_back .greeting_back_inner > div + div{padding-left:3.5%}
}

@media screen and (max-width: 1024px) {
	/*인사말*/
	.greeting .greeting_back:before{min-height:440px}
	.greeting .greeting_back .greeting_back_inner > div h3{font-size:28px}
	.greeting .greeting_back .greeting_back_inner > div h3:after{height:30px; margin:14px 0 14px 10px}
	.greeting .greeting_back .greeting_back_inner > div p{font-size:16px}
	.greeting .greeting_back .greeting_back_inner > div p + p{padding-top:42px}

	/*마이다스씨엠*/
	.greeting.reverse{background-position-y:408px}
}


@media screen and (max-width: 980px) {
	/*서브 공통*/
	.sub_visual{padding:65px 0}
	.sub_visual h1{font-size:40px}
	
	.sub_menu > div{width:100%!important}
	.sub_menu ul li{height:50px}
	.sub_menu ul li a span{font-size:15px}

	.sub_section{padding:70px 0}
	.sub_section h2{font-size:25px; padding-bottom:40px}

	/*인사말*/
	.greeting{background-position-y:315px}
	.greeting .greeting_back:before{min-height:430px; top:40px}
	.greeting .greeting_back .greeting_back_inner > div h3{font-size:24px; padding-top:40px}
	.greeting .greeting_back .greeting_back_inner > div p{font-size:14px; word-break:keep-all}
	.greeting .greeting_back .greeting_back_inner > div p br{display:none}
	.greeting .greeting_back .greeting_back_inner > div p + p{padding-top:25px}

	/*연혁*/
	.history .history_wrap{padding-bottom:40px}
	.history .history_wrap .history_inner > div{padding-bottom:20px}
	.history .history_wrap .history_inner > div h3{font-size:18px}
	.history .history_wrap .history_inner > div p{font-size:15px}

	.history .history_wrap .history_inner.right > div{padding-left:25px}
	.history .history_wrap .history_inner.left > div{padding-right:25px}
	.history .history_wrap .history_inner.right > div h3:before{width:20px; height:20px; left:-35px}
	.history .history_wrap .history_inner.left > div h3:before{width:20px; height:20px; right:-35px}
	.history .history_wrap .history_inner.right > div p:before{width:8px; height:8px; left:-28px}
	.history .history_wrap .history_inner.left > div p:before{width:8px; height:8px; right:-28px}

	.history .history_wrap .history_inner.right > div p.hide_line:after{left:-25px}
	.history .history_wrap .history_inner.left > div p.hide_line:after{right:-25px}

	/*오시는 길*/
	.contact .contact_inner ul{padding:30px 0 70px}
	.contact .contact_inner ul li + li{margin-left:15px}
	.contact .contact_inner ul li span{font-size:15px}
	.contact .contact_inner ul li span.label{font-size:15px; top:-6px; padding:6px 10px}
	.contact .contact_inner ul li:first-child span + span{padding-left:55px}
	.contact .contact_inner ul li:nth-child(2) span + span{padding-left:85px}
	.contact .contact_inner ul li:last-child span + span{padding-left:55px}

	/*마이다스씨엠*/
	.greeting.reverse{padding:70px 0 110px; background-position-y:315px}
	.greeting.reverse .greeting_back .greeting_back_inner > div + div{padding-top:40px}
}

@media screen and (max-width: 810px) {
	/*인사말*/
	.greeting .greeting_back:before{min-height:350px}
}

@media screen and (max-width: 767px) {
	/*인사말*/
	.greeting{background:none}
	.greeting .greeting_back:before{display:none}
	.greeting .greeting_back > div{width:100%}
	.greeting .greeting_back .greeting_back_inner{flex-wrap:wrap}
	.greeting .greeting_back .greeting_back_inner > div{width:100%; padding:0}
	.greeting .greeting_back .greeting_back_inner > div + div{padding:0 2.5%}
	.greeting .greeting_back .greeting_back_inner > div + div:before{content:''; width:100%; height:76%; background:#f9f9f9; position:absolute; bottom:-16%; left:0; z-index:-1}
	.greeting .greeting_back .greeting_back_inner > div img{width:100%; max-width:100%; display:none}
	.greeting .greeting_back .greeting_back_inner > div img.greeting_m{display:block}

	/*연혁*/
	.history h2{text-align:left}
	.history .history_wrap .history_img_holder{position:static; width:50%; padding-bottom:30px}

	.history .history_wrap .history_inner > div{width:100%}
	.history .history_wrap .history_inner.right{justify-content:flex-start}
	.history .history_wrap .history_inner.right > div{padding-left:35px}
	.history .history_wrap .history_inner.right > div:before{left:10px}
	.history .history_wrap .history_inner.left > div{text-align:left; padding-right:0; padding-left:35px}
	.history .history_wrap .history_inner.left > div:before{right:auto; left:10px}
	.history .history_wrap .history_inner.left > div h3:before{right:auto; left:-35px}
	.history .history_wrap .history_inner.left > div p:before{right:auto; left:-28px}
	.history .history_wrap .history_inner.left > div p.hide_line:after{right:auto; left:-25px;}

	/*조직도*/
	.organization .organization_inner img.pc_img{display:none}
	.organization .organization_inner img.m_img{display:block}

	/*오시는 길*/
	.contact .contact_inner ul li{display:block}
	.contact .contact_inner ul li + li{margin-left:0; margin-top:30px}
	.contact .contact_inner ul li span.label{width:76px; text-align:center}
	.contact .contact_inner ul li:first-child span + span{padding-left:85px}
	.contact .contact_inner ul li:last-child span + span{padding-left:85px}

	/*마이다스씨엠*/
	.greeting.reverse .greeting_back .greeting_back_inner{flex-wrap:wrap-reverse}
	.greeting.reverse .greeting_back .greeting_back_inner > div{padding:0 2.5%}
	.greeting.reverse .greeting_back .greeting_back_inner > div:before{content: ''; width: 100%; height: 84%; background: #f9f9f9; position: absolute; bottom: -29%; left: 0; z-index: -1}
	.greeting.reverse .greeting_back .greeting_back_inner > div + div{padding:0; width:100%}
	.greeting.reverse .greeting_back .greeting_back_inner > div + div:before{display:none}
}

@media screen and (max-width: 480px) {
	/*서브 공통*/
	.sub_visual{padding:55px 0}
	.sub_visual h1{font-size:30px}
	.sub_visual ul li, .sub_visual ul li a{font-size:13px}

	.sub_menu ul li a span{font-size:13px; padding:0 5px}

	.sub_section{padding:50px 0}
	.sub_section h2{font-size:20px; padding-bottom:30px}

	/*인사말*/
	.greeting .greeting_back .greeting_back_inner > div h3{font-size:22px}
	.greeting .greeting_back .greeting_back_inner > div + div:before{height:80.5%}
	.greeting .greeting_back .greeting_back_inner > div p{font-size:13px}

	/*연혁*/
	.history .history_wrap .history_img_holder{width:100%}
	.history .history_wrap{padding-bottom:30px}
	.history .history_wrap .history_inner > div h3{font-size:17px}
	.history .history_wrap .history_inner > div p{font-size:14px}

	/*오시는 길*/
	.contact .contact_inner ul{padding:30px 0 50px}
	.contact .contact_inner ul li span{font-size:14px}
	.contact .contact_inner ul li span.label{width:65px; font-size:14px; padding:6px}
	.contact .contact_inner ul li:first-child span + span{padding-left:70px}
	.contact .contact_inner ul li:nth-child(2) span + span{padding-left:70px}
	.contact .contact_inner ul li:last-child span + span{padding-left:70px}

	/*마이다스씨엠*/
	.greeting.reverse{padding:50px 0 70px}
	.greeting.reverse .greeting_back .greeting_back_inner > div:before{bottom:-20.5%}
}

@media screen and (max-width: 360px) {
	/*인사말*/
	.greeting .greeting_back .greeting_back_inner > div + div:before{height:81.5%}

	/*마이다스씨엠*/
	.greeting.reverse .greeting_back .greeting_back_inner > div:before{bottom:-17.5%}
}

@media screen and (max-width: 320px) {
	/*인사말*/
	.greeting .greeting_back .greeting_back_inner > div + div:before{height:84.5%}

	/*마이다스씨엠*/
	.greeting.reverse .greeting_back .greeting_back_inner > div:before{bottom:-16.5%}
}

