@charset "utf-8";

.visual-top {
	position:relative;
	height:280px;
	background:#eee;
}
.visual-title {
	position:relative;
	top:70px;
	width:100%;
	max-width:1240px;
	height:auto;
	margin:0 auto;
	text-align:center;
}
.visual-title > h2 {
	font-size:40px;
	color:#fff;
}

.location {
	margin-top:10px;
}
.location li {
	display:inline;
	color:#ffffff;
}
.location li > img {
	vertical-align:top;
}
.location li:not(:last-child):after {
	content:url(../img/icon/arrow_right.png);
	padding:0 5px 0 10px;
}

.sub-nav {
	position:absolute;
	bottom:0;
	width:100%;
	background:rgba(93, 122, 148, 0.7);
}
.sub-nav-list > li {
	float:left;
}
.sub-nav-list > li > a {
    display:table-cell;
    vertical-align:middle;
    border-left:1px solid #728a9c;
    color:#fff;
    height:60px;
    padding:0 40px;
}
.sub-nav-list > li:last-child > a {
	border-right:1px solid #728a9c;
}
.sub-nav-list > li > a:hover {
	background:#336699;
}
.sub-nav-list > li.on {
	background:#336699;
}

.content-area {
	padding:100px 0;
	overflow:hidden;
}
.content-point {
	text-align:center;
	background:#f9f9f9;
	padding:40px;
	font-size:20px;
	position:relative;
}
.content-point > span {
	font-size:20px;
	display:block;
}
.content-point:before {
	content:"";
	width:45px;
    height:45px;
    border-top:6px solid #336699;
    border-left:6px solid #336699;
    position:absolute;
    display:block;
    top:0;
	left:0;
}
.content-point:after {
	content:"";
	width:45px;
    height:45px;
    border-bottom:6px solid #336699;
    border-right:6px solid #336699;
    position:absolute;
    display:block;
    bottom:0;
	right:0;
}
.content-section {
	margin-top:80px;
	overflow:hidden;
}
.content-left {
	width:230px;
	margin-right:20px;
	float:left;
}
.content-left > span {
	display:block;
	font-size:30px;
	font-weight:700;
}
.content-right {
	float:left;
	width:calc(100% - 250px);
}
.content-normal {
	text-align:justify;
}
h1.content-tltle {
	border-left:8px solid #336699;
	font-size:24px;
	font-weight:600;
	color:#000;
	line-height:26px;
	padding-left:10px;
	margin-bottom:20px;
}
h2.content-tlt {
	font-size:24px;
	font-weight:600;
	color:#333366;
	margin-bottom:20px;
}
.content-normal .text {
	margin-bottom:40px;
}
.text-refer {
	color:#f60;
}

.text > span {
	display:block;
	margin-bottom:20px;
	font-size:14px;
}

.top-bg01 {
	background:url(../img/sub/bg_01.png) no-repeat 50% 50%;
	background-size:cover;
}
.top-bg02 {
	background:url(../img/sub/bg_02.png) no-repeat 50% 50%;
	background-size:cover;
}
.top-bg03 {
	background:url(../img/sub/bg_03.png) no-repeat 50% 50%;
	background-size:cover;
}
.top-bg04 {
	background:url(../img/sub/bg_04.png) no-repeat 50% 50%;
	background-size:cover;
}
.top-bg05 {
	background:url(../img/sub/bg_05.png) no-repeat 50% 50%;
	background-size:cover;
}

/* 1_1 */
.download > li {
	display:inline;
}
.download > li > a {
	min-height:50px;
    padding:14px 60px;
    font-size:16px;
    line-height:50px;
    text-align:center;
    background:#333366;
    color:#fff;
}
.download > li > a:before {
    content:url(../img/icon/download.png);
    padding:0 10px;
}
.download > li > a:hover {
	background:#336699;
}
/* 1_2 */
.sign {
	float:right;
}
/* 1_3 */
.table-info {
	width:100%;
	margin-top:10px;
	border-collapse:collapse;
	border-spacing:0;
}
/* 1_4 */
.org-tree > li {
	height: 200px; line-height: 60px;
}
.org-tree > li:nth-child(2) { height: 150px; }
.sub-org { width:100%; text-align:center; position:relative; }
.sub-org > li { display:inline-block; }
.first-org > li { width:18%; }
.first-org > li:first-child { float:left; }
.first-org > li:last-child { float:right; }
.first-org > li > a {
	position:relative;
	background:#369;
	color:#fff;
	width:100%;
	display:inline-block;
}
.first-org > li > a::before {
    width: 1px;
    height: 5rem;
    top: -4.9rem;	
    left: 50%;
}
.first-org::before {
    width: 82.1%;
    height: 1px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: -73px;
    left: 50%;

}
.second-org::before {
    width: 30.3%;
    height: 1px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: -66px;
    left: 50%;
}
.second-org > li { width:30%; }
.second-org > li > a { position:relative; }
.second-org > li > a::before {
    width: 1px;
    height: 6rem;
    top: -4.4rem;	
    left: 50%;
}
.ceo {
	border: 2px solid #369;
    width:18%;
	display:inline-block;
	position:relative;
}
.ceo::before {
    width: 1px;
    height: 28.2rem;
    top: 100%;
    left: 50%;
}
.second-org > li > a {
	background: #369;
    color: #fff;
    width:50%;
	display:inline-block;
}


.center { text-align:center; }
.clear { clear:both; }
.clear  > a {
	background: #369;
    color: #fff;
    width:18%;
	display:inline-block;
}

.first-org::before,
.first-org > li > a::before,
.second-org::before,
.second-org > li > a::before,
.ceo::before{
	content: "";
    background: #728a9c;
    position: absolute;
    z-index: -1;	
}

.no-line::before {display:none;}


.third{
    clear:both;
    width:40%;
    float:left;
    position:relative;
    left:14%
}

.liner{
    width: 1px;
    height: 5rem;
    background:#728a9c;
    float:left;
    margin-left:32%;
    position:relative;
    left:2%
}

.third::before,
.third > li > a::before{
	content: "";
    background: #728a9c;
    position: absolute;
    z-index: -1;	
}

.forth{
    width:40%;
    float:left;
    position:relative;
    left:6%
}

.third li{
    width:45%;
}


.forth li{
    width:45%;
}



/*클래스명 바꾸기*/
.table-title {
    width:20%;
    border-bottom:1px solid #333366;
    font-weight:bold;
    text-align:center;
    padding:15px 0;
}
.table-detail {
    width:80%;
    border-bottom:1px solid #d8d8d8;
    padding-left:20px;
}

/* 탭버튼 */
.tap {
	display:inline-block;
	width:100%;
	margin-bottom:20px;
}
.tap > li > a{
	float:left;
    background:#333366;
    text-align:center;
    line-height:50px;
    padding:0 60px;
	margin:0 2px 2px;
    font-size:16px;
    color:#fff;
}
.tap a {
    font-size:16px;
    color:#fff;
}
.tap li:before {
    padding:0 10px;
}
.tap li a:hover {
	background:#336699;
}

/* 약관 */
.policy-box:not(:last-child) {
	margin-bottom:50px;
	}
.policy-box > h1 {
	font-size:22px;
	margin-bottom:30px;
}
.policy-box > h1:before	{
    content:'';
    display:inline-block;
    margin:0 8px 0 -8px;
    width:25px;
    height:4px;
    background:#336699;
    vertical-align:super;
}
.policy-box > p {
	font-weight:600;
	margin-bottom:5px;
}
.policy-box > ul {
	margin-bottom:15px;
}
.policy-box > ul > li {
	color:#666;
	padding-left:10px;
	margin-bottom:5px;
}
.policy-box > ul > li:before	{
	content:'';
    display:inline-block;
    margin:0 8px 0 -8px;
    width:2px;
    height:2px;
    background:#666666;
    vertical-align:middle;
}

.table-policy {
	width:100%;
	border-collapse:collapse;
	text-align:center;
	margin:20px 0;
}
.table-title02 {
	background:#f9f9f9;
	border-top:2px solid #336;
	padding:10px;
}
.table-detail02 {
	border:1px solid #eee;
	border-left:none;
	padding:10px;
}
.table-detail02 > a {
	color:#336699;
}

/* 모바일형 nav 전환 */
@media (max-width:970px) {
	.content-area {
		padding:30px 10px;
		overflow:hidden;
	}
	.content-point > span {
		display:inline;
	}
	.content-left {
		width:auto;
		float:none;
		text-align:center;
		margin-right:0;
	    margin-bottom:20px;
	}
	.content-right {
		float:none;
		width:100%;
	}
	.content-left > span {
		display:inline;
		font-size:25px;
		font-weight:700;
	}
	.download {
		text-align:center;
	}
}

/* 모바일 시작 */
@media (max-width:640px) {
	.sub-nav-list > li > a {
		height:40px;
		font-size:12px;
		letter-spacing:-0.04em;
		padding:0 16px;
	}
	.download > li {
		display:block;
	}
	.policy-box > h1 {
		font-size:20px;
		margin-bottom:25px;
	}
	.tap > li {
		width:49%;
		line-height:40px;
		padding:0;
		margin:0 1px 1px;
	}
	.tap a {
		font-size:14px;
	}
/*
	.carousel-caption {
		top:20%;
	}
	.carousel-caption p {
		font-size:13px;
	}
	.carousel-caption h2 {
		font-size:25px;
	}
*/
	.content-section {
		margin-top:40px;
	}
	.content-normal .text {
		margin-bottom:20px;
	}
	.content-point {
		font-size:15px;
		padding:30px;
	}
	.content-point > span {
		font-size:15px;
	}
	.text > span {
		font-size:15px;
	}
	
	/*1_4*/
	.ceo { width:90%; }
	.clear > a { width:30%; }
	.first-org > li > a > span { display:block; }
	.second-org > li { width:48.9%; }
	.second-org > li > a { width:80%; }
	.second-org::before { width:50%; }
}