/* Animate.css - http://daneden.me/animate | Licensed under the ☺ license (http://licence.visualidiot.com/) Copyright (c) 2012 Dan Eden | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */


/* ********************************************************************* SUBPAGE 서브페이지 ********************************************************************** */
#subContents { padding:200px 0 150px; margin:0 auto; width:1200px; }
#subContents .sub_title {  margin-bottom:40px; }
#subContents .sub_title h3 { font-size:40px; font-weight:700; color: #0088c7; letter-spacing:-1px; }
#subContents .m_title { margin-bottom:20px; font-size:32px; font-weight:500; color:#121212; }
#subContents .cont { margin-bottom:80px; }
#subContents .cont:last-child { margin-bottom:0; }
#subContents .box { display:flex; flex-wrap:wrap; }
#subContents .box dl { width:32%; margin-right:2%; }
#subContents .box dl:nth-of-type(3n) { margin-right:0; }
#subContents .box dt { padding-bottom:20px; font-size:24px; font-weight:500; color:#121212; }
#subContents .box dd.img { height:200px; }
#subContents .box dd ul { margin-top:20px; }
#subContents .products { display:flex; flex-wrap:wrap; }
#subContents .products dl { width:23.5%; margin-right:2%; margin-bottom:2%; border:1px solid #dadada; }
#subContents .products dl:nth-of-type(4n) { margin-right:0; }
#subContents .products dt { text-align:center; }
#subContents .products dd p.tit { margin:0; padding:10px; font-size:18px;  font-weight:500; background:#0088c7; color:#fff; text-align:center; }
#subContents .products dd p, #subContents .products dd ul { margin:10px; }
#subContents .products .basic_list li, #subContents .products p { font-size:14px; letter-spacing:-1px; }

.sub1 .box_top { margin-bottom:30px; }
.sub1 .box_top dl { display:table; width:100%;  }
.sub1 .box_top dt { display:table-cell; width:400px; }
.sub1 .box_top dd { display:table-cell;  padding:40px; width:calc(100% - 400px); background:#f8f8f8; }
.sub1 .box_top dt.img1 {  background: url(/images/mtl01r-19-0004/main/solution_img01.jpg) center center/cover; }
.sub1 .box_top dt.img2 {  background: url(/images/mtl01r-19-0004/main/solution_img02.jpg) center center/cover; }
.sub1 .box_top dt.img3 {  background: url(/images/mtl01r-19-0004/main/solution_img03.jpg) center center/cover; }
.sub1 .box_top p.tit { margin-bottom:20px; font-size:20px; font-weight:500; color:#121212;  word-break:keep-all; }

.sub2 .box dl:nth-of-type(1) dd.img {  background: url(/images/mtl01r-19-0004/sub/sub2_img01.jpg) center center/cover; }
.sub2 .box dl:nth-of-type(2) dd.img {  background: url(/images/mtl01r-19-0004/sub/sub2_img02.jpg) center center/cover; }
.sub2 .box dl:nth-of-type(3) dd.img {  background: url(/images/mtl01r-19-0004/sub/sub2_img03.jpg) center center/cover; }
.sub2 .box_area { display:table; width:100%; border:1px solid #dadada;  background:#fff; box-shadow:3px 3px 5px rgba(0,0,0,0.15); }
.sub2 .box_area > div { padding:40px; display:table-cell; width:50%; vertical-align:middle; }
.sub2 .box_area > div.img_area { padding:40px 0px 40px 40px; }
.sub2 .box_area > div.txt_area dl { margin-bottom:80px; }
.sub2 .box_area > div.txt_area dl:last-child { margin-bottom:0; }
.sub2 .box_area > div.txt_area dt { padding-bottom:20px; font-size:20px; font-weight:500; color:#121212;  }

.sub3-5 .img_area ul:after { content:""; display:block; clear:both; }
.sub3-5 .img_area li { float:left; width:50%; }
.sub3-5 .txt_area ul { margin-top:30px; }
.sub3-5 .txt_area li { margin-bottom:40px; }
.sub3-5 .txt_area p.tit { font-size:24px; font-weight:500; color:#121212; }
.sub3-5 .txt_area p.url { word-break:break-all; }

.history_issue { position: relative; }
.history_issue:before {content:''; display:block; width:1px; height:100%; background:#ccc; position: absolute; left:0; top:0;}
.history_issue > li {display:block; position: relative; margin-bottom:80px; padding-left:70px; }
.history_issue > li:before {position:absolute; content:''; display:inline-block; left:0; top:21px; width:50px; height:1px; background:#ddd;}
.history_issue > li:after {position: absolute; content:''; display:inline-block; left: -5px; top: 16px; width:11px; height:11px; border-radius:50%; background:#ed0277; }
.history_issue > li h3 {font-size: 38px; color: #121212; font-weight:600;  margin-bottom: 25px; }
.history_issue > li .histroy-img {display:block; position:absolute; left:-50%; top:0;}
.history_issue > li .histroy-img .box { display:table; width:200px; height:200px; background:#fff; border:2px solid #15a3df; border-radius:50%; }
.history_issue > li .histroy-img .box > div { display:table-cell; text-align:center; vertical-align:middle; }
.history_issue > li .histroy-img .box p.tit { font-size:24px; font-weight:500; color:#15a3df; }
.history_issue > li .histroy-img .box p.tit strong { font-size:28px; font-weight:600; }
.history_issue > li:nth-child(even) .histroy-img { left:auto; right:-50%;}
.issue-list > li { position: relative; font-size:17px; color:#555; margin-bottom: 10px; padding-left: 10px; line-height:1.3; word-break:keep-all; }
.issue-list > li:last-child {margin-bottom: 20px;}
.issue-list > li:before {position:absolute; content:''; display:inline-block; width:3px; height:3px; left:0; top:9px;  border-radius: 50px; background:#121212; }
.history_issue > li:nth-child(even) .issue-list > li:before {position:relative; top:-5px; margin-right:10px;}

.org_chart { margin:0 auto; width:100%; }
.org_chart > div { position:relative; }
.org_chart > div:after { content:""; display:block; clear:both; }
.org_chart dl { position:relative; z-index:100; }
.org_chart dt { position:relative; z-index:1000; padding:20px 0; text-align:center; border-radius:5px 5px 0 0;  background: linear-gradient(to bottom, #009adb 50%,#0088c7 51%);  color:#fff; }
.org_chart  .depth1 { padding:0 0 100px; }
.org_chart  .depth1:before { z-index:10; content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#dadada;}
.org_chart  .depth1 > div { position:relative; z-index:100; margin:0 auto; display:table; width:180px; height:180px; border-radius:50%; border:2px solid #0088c7; background:#fff;  }
.org_chart  .depth1 > div p { display:table-cell; font-size:24px; font-weight:500;  color:#0088c7; vertical-align:middle; text-align:center; }
.org_chart  .depth2 { width:100%; }
.org_chart  .depth2:before { z-index:10; content:""; position:absolute; left:9.2%; top:0; width:81.6%; height:1px; background:#dadada;}
.org_chart  .depth2:after { content:""; display:block; clear:both; }
.org_chart  .depth2 dl { float:left; padding:100px 0 0; width:18.4%; margin-right:2%; }
.org_chart  .depth2 dl:last-child { margin-right:0; }
.org_chart  .depth2 dl:before { z-index:10; content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#dadada; }

.basic_table { width:100%; border-collapse:collapse; }
.basic_table th { padding:20px 0; text-align:center; background:#f8f8f8;  border-top:1px solid #121212; border-bottom:1px solid #dadada; }
.basic_table td { padding:15px 0; border-bottom:1px solid #dadada; border-right:1px solid #dadada; }
.basic_table tr td:last-child { border-right:none; }
.basic_table .cate { width:150px; text-align:center; }
.basic_table .no { width:180px; text-align:center; }
.basic_table .period { width:220px; text-align:center; }
.basic_table .org { width:180px; text-align:center; }
.basic_table td.title { padding:10px 20px; }
.basic_table td.cate{ background:#f9fbfc; color:#0088c7; font-weight:500; }


@media only screen and (max-width: 1200px) {
	#subContents { width:100%; }
}

@media only screen and (max-width: 980px) {
	#subContents { padding:100px 40px 100px; }
}

@media only screen and (max-width: 768px) {
	#subContents { padding:80px 20px 40px; }

	#subContents .sub_title {  margin-bottom:30px; }
	#subContents .sub_title h3 { font-size:32px; }
	#subContents .m_title { font-size:24px; }
	#subContents .cont { margin-bottom:50px; }
	#subContents .box { display:block; }
	#subContents .box dl { width:100%; margin-right:0; margin-bottom:30px; }
	#subContents .box dt { padding-bottom:10px; font-size:18px; }
	#subContents .box dt br { display:none; }
	#subContents .box dd.img { height:150px; }
	#subContents .box dd ul { margin-top:20px; }
	#subContents .products { display:flex; flex-wrap:wrap; }
	#subContents .products dl { width:100%; margin-right:0 !important; margin-bottom:2%; }
	#subContents .products dd p.tit { padding:5px; font-size:16px; }
	#subContents .products .basic_list li, #subContents .products p { font-size:13px; }
	#subContents .products .basic_list li { padding-left:10px; }		
	#subContents .products .basic_list li:before { top:9px; width:4px; }

	.sub1 .box_top { margin-bottom:20px; }
	.sub1 .box_top dt { display:block; width:100%; height:180px; }
	.sub1 .box_top dd { display:block; padding:20px; width:100%; }
	.sub1 .box_top p.tit { font-size:18px;}

	.sub1 .box dd p.tit { font-size:17px;}

	.sub2 .box_area > div { padding:20px !important; display:block; width:100%; }
	.sub2 .box_area > div.img_area { padding:20px 20px 0 !important; margin-bottom:20px; }
	.sub2 .box_area > div.txt_area dl { margin-bottom:40px; }
	.sub2 .box_area > div.txt_area dt { padding-bottom:10px; font-size:16px; }

	.sub3-5 .img_area li { float:none; width:100%; margin-bottom:10px; }
	.sub3-5 .img_area li:last-child { margin-bottom:0; }
	.sub3-5 .txt_area ul { margin-top:20px; }
	.sub3-5 .txt_area li { margin-bottom:30px; }
	.sub3-5 .txt_area p.tit { font-size:20px; }

	.history_issue:before { display:none; }
	.history_issue > li {display:block; position: relative; margin-bottom:40px; padding-left:0px; }
	.history_issue > li:before {display:none; }
	.history_issue > li:after { display:none; }
	.history_issue > li h3 {font-size:20px; margin-bottom:15px; }
	.issue-list > li { font-size:15px; margin-bottom: 10px; padding-left: 10px; }
	.issue-list > li:before { background:#ed0277; }

	.org_chart dt { padding:10px 0; }
	.org_chart  .depth1 { padding:0 0 30px; }
	.org_chart  .depth1 > div { width:150px; height:150px; }
	.org_chart  .depth2 { display:block;}
	.org_chart  .depth2:before { display:none}
	.org_chart  .depth2 dl  { float:none; padding:30px 0 0; width:100%; margin-right:0; }

	.basic_table th { padding:5px; font-size:13px; word-break:break-all; }
	.basic_table td { padding:3px; font-size:11px; word-break:break-all; }
	.basic_table .cate { width:60px; }
	.basic_table .no { width:80px; }
	.basic_table .period { width:80px; }
	.basic_table .org { width:80px; }
	.basic_table td.title { padding:3px 5px; }

}


/* ********************************************************************* 게시판 CSS ********************************************************************** */


/* 일반게시판 List */

.whois-board-list {
    display: inline-block;
    padding: 0;    
}

.whois-board-list .whois-board-row {
    width: 100%;
    margin: 0 0 0 0;
    padding: 15px 0 15px 0;
    float: left;
    border-bottom: 1px solid #eee;
    color: #000000;
}

.whois-board-list .whois-board-row:first-child {
    border-top: 1px solid #1c9e75;
}
.whois-board-list .whois-board-row .whois-board-row-noti {
	background: #1c9e75 !important;
}

/* Line 색상 */

.whois-board-list .whois-board-row .whois-board-row-subject {
    margin: 0 0 5px 0;
    padding: 0;
    font-size: 14px;
    font-weight: 600;
}

.whois-board-list .whois-board-row .whois-board-row-info {
    color: #acacac;
}
.whois-board-row-info {
	line-height:45px;	
}
.whois-board-list .whois-board-row .whois-board-row-info .whois-board-row-author {
    max-width: 33vw;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}


/* 일반게시판 view */

.whois-board-view {
    display: inline-block;    
    border-top: 1px solid #0062AA;
}


/* Line 색상 */

.whois-board-view .whois-board-view-row {
    width: 100%;
    margin: 0;
    padding: 0;
    padding: 10px 0 10px 0;
    float: left;
    border-bottom: 1px solid #eee;
}

.whois-board-view .whois-board-view-row .whois-board-view-subject {
    width: 100%;
    margin: 0 0 15px 0;
    padding: 0;
    float: left;
    font-size: 18px;
    font-weight: 600;
}

.whois-board-view .whois-board-view-row .whois-board-view-author {
    width: 100%;
    margin: 0 0 5px 0;
    padding: 0;
    float: left;
    font-size: 13px;
    font-weight: 600;
}

.whois-board-view .whois-board-view-row .whois-board-view-info {
    width: 100%;
    margin: 0;
    padding: 0 0 10px 0;
    float: left;
    color: #acacac;
}

.whois-board-view .whois-board-view-row .whois-board-view-content {
    width: 100%;
    margin: 0;
    padding: 10px 0 10px 0;
    float: left;
    font-size: 12px;
}

.whois-board-view .whois-board-view-files {
    width: 100%;
    margin: 0;
    padding: 0;
    float: left;
}

.whois-board-view .whois-board-view-files .whois-board-view-file {
    width: 100%;
    margin: 0;
    padding: 5px 0;
    float: left;
    font-size: 12px;
}

.whois-board-view .whois-board-view-files .whois-board-view-file .whois-board-view-file-count {
    font-size: 11px;
    color: #c4c4c4;
}


/* 게시판 버튼 */

.btn-search,
.whois-button-submit,
.btn-sub {
    color: #fff;
    background-color: #ed0277;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.btn-search:hover,
.btn-search:focus,
.whois-button-submit:hover,
.whois-button-submit:focus,
.btn-sub:hover,
.btn-sub:focus {
    color: #fff;
    background-color: #121212;
}


/* 게시판 공통 */

.whois-board-list .sub-box {
	margin-right:5px;
	background-color: #1c9e75;
	border: 0;
    color:#ffffff;
	display: inline-block;
}
.whois-board-list .end-event {
    background: #bbb;
}
.sub-box.sm {
    font-size: 12px;
    padding: 2px 5px;
}

.sub-box.m {
    font-size: 14px;
    padding: 4px 8px;
}

.sub-box.lg {
    font-size: 16px;
    padding: 6px 12px;
}

.sub-border {
    border: 1px solid #0062AA;
}

.sub-border-t {
    border-top: 1px solid #0062AA;
}

.sub-border-r {
    border-right: 1px solid #0062AA;
}

.sub-border-b {
    border-bottom: 1px solid #0062AA;
}

.sub-border-l {
    border-left: 1px solid #0062AA;
}

.sub-bg {
    background-color: #1c9e75;
}

.sub-bg-hover:hover {
    background-color: #1c9e75;
}

/* ********************************************************************* 로그인/회원가입 관련 CSS ********************************************************************** */

.material-form {
    background: #fff;
    /*border: 1px solid #ccc;*/
    margin: 0 auto;
}

.material-form .header {
    background: #6498fe;
    color: #fff;
    font-size: 16px;
    padding: 50px 10px;
}

.material-form .header h3 {
    font-size: 30px;
}

.material-form .header p,
.material-form .header span {
    color: #fff;
    font-size: 16px;
    margin-top: 15px;
}

.material-form .sub-header h4 {
    font-weight: bold;
    height: 34px;
    line-height: 34px;
    font-size: 16px;
}

.material-form .sub-content .form-group:last-child {
    margin: 0;
}

.material-form .body {}

.material-form .input-group {
    border: 0;
    position: relative;
}

.material-form .input-group .input-group-addon {
    background: #fff;
    border: 0;
    padding-left: 6px;
    padding-right: 6px;
}

.material-form .form-control,
input[type='text'].whois,
input[type='password'].whois,
select.whois {
    border: 1px solid #ccc;
    transition: 0.3s all ease;
}


/*.material-form .btn:first-child,*/

.material-form .input-group .form-control:first-child,
.material-form .input-group .form-control.first,
.material-form .input-group .th + .form-control,
.th + input[type='text'].whois,
.th + input[type='password'].whois,
.th + select.whois {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}


/*.material-form .btn:last-child,*/

.material-form .input-group .form-control:last-child,
.material-form .input-group .form-control.last,
.material-form .input-group .input-group-btn:last-child,
.material-form .input-group .input-group-btn:last-child button,
.material-form .input-group .input-group-btn:last-child .btn {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.material-form .form-group {
    margin-bottom: 15px;
    overflow: visible;
}

.material-form .form-group.success .form-control {
    color: #5cb85c;
}

.material-form .form-group.failed .form-control {
    color: #d9534f;
}

.material-form .form-control[readonly] {
    background: #fff;
}

.material-form .btn {
    height: 38px;
}

.material-form .btn-default {
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.material-form .input-group input,
.material-form .input-group select,
input[type='text'].whois,
input[type='password'].whois,
select.whois {
    z-index: 10;
}

.input-group label.th {
    color: #ccc;
    display: none;
    height: 20px;
    left: 10px;
    margin-top: -10px;
    position: absolute;
    top: 50%;
    z-index: 9;
}

.input-group label.th.ie9 {
    display: block;
    z-index: 11;
}

.material-form .desc {
    padding: 10px 0;
}

.chkbox{display:inline-block; margin:0; padding:0;}
.chk-block,
.chk-block span{display:block; text-align:center; width:100%;}

.chkbox input[type='radio'],
.chkbox input[type='checkbox']{display:none;}
.chkbox input[type='radio']~.rbtn{padding: 6px 12px; line-height:27px; border:1px solid #ccc; border-radius:3px; cursor:pointer;}
.chkbox input[type='radio']:checked~.rbtn{background:#ccc; color:#fff;}
.chkbox input[type='radio']~.box,
.chkbox input[type='checkbox']~.box{display:block; color:#bbb; cursor:pointer; transition:0.5s all ease;}
.chkbox input[type='radio']~.box:before,
.chkbox input[type='checkbox']~.box:before{display:inline-block; margin-right:5px; padding:2px;	font-family:'Glyphicons Halflings'; font-size:18px; font-weight:normal; line-height:1; text-align:center; transition:0.4s all ease; vertical-align:middle; color:#cfcfcf;}
.chkbox input[type='radio']~.box:before{content:"\e165";}
.chkbox input[type='checkbox']~.box:before{content:"\e013";}
.chkbox input[type='radio']:checked~.box,
.chkbox input[type='checkbox']:checked~.box{color:#666;}
.chkbox input[type='radio']:checked~.box:before,
.chkbox input[type='checkbox']:checked~.box:before{color:#666;}

.input-group-addon .box .material-icons {
    font-size: 15px;
    padding-right: 5px;
}


.chkbox input[type='radio']:checked~.box,
.chkbox input[type='checkbox']:checked~.box {
    color: #666;
}

.chkbox input[type='radio']:checked~.box:before,
.chkbox input[type='checkbox']:checked~.box:before {
    color: #666;
}