@charset "utf-8";

.sub-intro-menu {text-align:center; padding:30px 0 10px; display:block;}
.sub-intro-menu.nobg {background:#fff !important;}
.sub-intro-menu a {display:inline-block; padding:10px 30px; position:relative; font-size:17px; font-family:'ntsr', sans-serif; color:#777; letter-spacing:-0.06em;}
.sub-intro-menu a.active {color:#333; font-size:18px; font-family:'ntsb';}
.sub-intro-menu a.active:after {content: ''; display: block; position: absolute; left: 30px; bottom: 1px; right:30px; width: calc(100% - 60px); height: 2px; background-color: #774e6b;}
.sub-intro-menu a:before {content: ''; display: block; position: absolute; left: 0; top: 11px; width: 1px; height: 18px; background-color: #dce0e6;}
.sub-intro-menu a:first-child:before {display:none;}

@media only screen and (max-width : 767px){
	.sub-intro-menu {padding:15px 0 5px;}
	.sub-intro-menu a {padding:5px 3px 5px 5px; font-size:13px;}
	.sub-intro-menu a.active {font-size:13px;}
	.sub-intro-menu a.active:after {left: 6px; bottom: 1px; right:3px; width: calc(100% - 8px);}
	.sub-intro-menu a:before {top: 8px; height: 14px; background-color: #ccc;}
}

.content-intro {margin:20px auto; max-width:1380px; padding:120px 40px 80px;}
.content-intro.dokdo-wrap {margin:100px auto 80px; max-width:1380px; padding:0; height:808px; background:url(../dokdo/images/introduce/guide_bg.jpg) no-repeat top center;}/*230412*/
.content-intro.dokdo-wrap .dokdo-con { font-size:20px; color:#404040; margin:0 auto; padding:30px 0; width:580px; line-height:1.8; font-family:'ntsm'; letter-spacing:-0.02em; text-align:left; word-break:keep-all;}/*230412*/

.content-top {text-align: center;}
.content-top .page-title {padding: 0 0 50px; font-family:'ntsb', '나눔고딕', '맑은 고딕', 'YetHangul', '돋움', Dotum, '새굴림', sans-serif; font-size: 38px; color: #212121; letter-spacing: -2.5px; word-break:keep-all;}/*230412*/
.content-top .page-sum {padding: 0 0 50px; font-family:'ntsb'; font-size: 30px; color: #333; line-height: 1.6; font-weight:500; letter-spacing: -0.06em; word-break:keep-all; text-align:left;}/*230413*/

.content-box {display:flex; align-items:flex-start; margin-bottom:100px;}
.content-box .left {width:323px; padding-top:20px; margin-right:20px; font-family:'ntsm', '나눔고딕', '맑은 고딕', 'YetHangul', '돋움', Dotum, '새굴림', sans-serif; font-size: 21px; color: #222; line-height: 1.4; letter-spacing: -0.6px; word-break:keep-all; position:relative;}/*230413*/
.content-box .left:after {content:''; position:absolute; top:0; left:0; width:140px; display:block; border-top: 2px solid #333; margin-top:4px;}
.content-box .left.lg {font-size:1.6em; font-weight:600;}
.content-box .right {width:calc(100% - 343px); border-top: 2px solid #333; margin-top:4px; font-size:16px; letter-spacing: -0.02em; line-height:1.8;}
.content-box .right .con {margin: 16px 0 0; word-break:keep-all;}
.content-box .right .con .con-title {font-size:1.1em;}
.content-box .right .ext {margin: 16px 0 0; font-size:14px;}
.content-box .right .help-title {font-size:1.15em; text-align:center; font-weight:600; background:#f3f3f3; margin:70px 0 0; padding:8px 20px; border-radius:4px;}

.content-box .right dl {width: 100%; display:flex; align-items:flex-start; padding:19px 0 28px; border-bottom: 1px solid #e1e1e1; font-size: 16px; line-height:1.4; color: #222;}
.content-box .right dl dt {width:160px;}
.content-box .right dl dd {width:calc(100% - 160px); color: #606167; letter-spacing: -0.01em;}
.content-box .right .full {padding:19px 0 28px; border-bottom: 1px solid #e1e1e1; font-size: 16px; line-height:1.4; color: #222;}

.content-box .s-title {font-size:18px; padding:40px 0 10px; font-weight:600;}
.content-box .s-title.first {padding:0 0 10px;}

@media only screen and (max-width : 1024px){
	.content-box {display: block; margin-bottom:40px;}
	.content-box .left {width:100%; margin-right:0;}
	.content-box .right {width:100%;}
	.content-box .right .help-title {margin:40px 0 0; padding:4px 20px;}
}

@media only screen and (max-width : 767px){
	.content-intro {padding:40px 8px 50px;}	
	.content-intro.dokdo-wrap {margin:40px auto 40px; max-width:767px; padding:0; height:708px; background:url(../dokdo/images/introduce/guide_bg.jpg) no-repeat top center / cover;}/*230412*/
	.content-intro.dokdo-wrap .dokdo-con { font-size:15px; padding:30px 0; width:300px;}/*230412*/

	.content-top .page-title {padding: 0 0 50px; font-size: 30px; color: #212121; letter-spacing: -0.09em;}
	.content-top .page-sum {padding: 0 0 50px; font-size: 22px;}
	.content-box .left {font-size: 17px;}
	.content-box .right {font-size:13px; line-height:1.8;}
	.content-box .right .ext {font-size:13px;}
	
	.content-box .right dl {padding:14px 0 18px; font-size: 13px;}
	.content-box .right dl dt {width:90px;}
	.content-box .right dl dd {width:calc(100% - 90px);}
	.content-box .right .full {padding:14px 0 18px; font-size: 13px;}
	
	.content-box .s-title {font-size:14px; padding:40px 0 10px;}
	.content-box .s-title.first {padding:0 0 10px;}
}

.list-style-num {font-size:16px; color:#222; line-height:1.4; letter-spacing:-0.01em; padding:7px 0 0;}
.list-style-num li {position:relative; padding:10px 0 10px 1.8em;}
.list-style-num li.li-full {padding:10px 0;}
.list-style-num li em {position:absolute; left:0; top:10px;}

.list-style-exam {font-size:.9em; color:#990000; line-height:1.4; letter-spacing:-0.01em; padding:4px 0; margin:10px 0 0 0; background:#e9e9e9; border-radius:4px;}
.list-style-exam li {position:relative; padding:5px 10px 5px 2.3em;}
.list-style-exam li.li-full {padding:5px 0;}
.list-style-exam li em {position:absolute; left:.5em; top:7px; font-weight:600; font-size:.9em;}

.list-style-bar {font-size:15px; color:#222; line-height:1.4; letter-spacing:-0.01em; padding:7px 0 0;}
.list-style-bar li {position:relative; padding:4px 0 4px 1.4em;}
.list-style-bar li.li-full {padding:4px 0;}
.list-style-bar li em {position:absolute; left:0; top:4px;}

.list-style-bar .list-style-exam {padding:4px;}
.list-style-bar .list-style-exam li em {top:5px;}

.b-lg {font-size:1.1em; font-weight:600;}
.b-mid {font-size:1.04em; font-weight:600;}
.b-basic {font-weight:600;}
.img-icon {position:relative; top:3px; padding:0 10px; opacity:.4;}

.exam {color:#990000; font-size:.9em;}
.exam.b {font-weight:600;}
.fc-point {color:#6ea115;}
.fc-purple {color:5426bc;}
.fc-hanja {font-family:'나눔고딕', '맑은 고딕', 'ntsr';}

.table-info-wrap {width:100%; overflow-x:auto;}
.table-info {border:1px solid #ddd; border-top:1px solid #bbb; border-width:1px 0 0 1px; font-size:15px; color:#222; line-height:1.4; width:100%;}
.table-info th {padding:15px 10px; background:#f0f0f0; font-size:.9em; font-weight:600; border:1px solid #ddd; border-width:0 1px 1px 0; text-align:center;}
.table-info td {padding:15px 10px; border:1px solid #ddd; border-width:0 1px 1px 0;}

.tc {text-align:center;}

@media only screen and (max-width : 767px){
	
	.list-style-num {font-size:13px; padding:7px 0 0;}
	.list-style-num li {padding:10px 0 10px 1.4em;}
	.list-style-num li.li-full {padding:10px 0;}
	.list-style-num li em {top:11px;}
	
	.list-style-exam {padding:4px 0; margin:10px 0 0 0;}
	.list-style-exam li {padding:5px 10px 5px 2.3em;}
	.list-style-exam li.li-full {padding:5px 0;}
	.list-style-exam li em {left:.5em; top:7px;}
	
	.list-style-bar {font-size:12px; padding:7px 0 0;}
	.list-style-bar li {padding:4px 0 4px 1.4em;}
	.list-style-bar li.li-full {padding:4px 0;}
	.list-style-bar li em {top:4px;}
	
	.list-style-bar .list-style-exam {padding:4px;}
	.list-style-bar .list-style-exam li em {top:5px;}

	.table-info {width:180%;}
	.table-info {font-size:13px;}
	.table-info th {padding:15px 10px;}
	.table-info td {padding:15px 10px;}
}

.logo_font {width:230px; padding:8px 40px 0 0; float:left;}
.ci-v {width:100px;}
.ci-h {width:320px;}
.ci {display:flex; flex-wrap:wrap; align-items:start; color:#aaa;}
.ci li {padding:30px;}
.btn_intro {padding:15px 20px; margin:5px 5px 0 0; text-align:center; width:10em; border:1px solid #ddd; border-radius:2px; font-size:1em; line-height:1; display:inline-block;}
.btn_intro.long {width:auto;}
.btn_intro:hover {background:#439cec; transition: all .3s; color:#fff; border:1px solid #439cec;}
.btn_intro.long:hover {background:#f1f1f1; color:#6ea115; border:1px solid #ddd;}

.timeline {display:flex; flex-wrap:wrap; align-items:start; margin-top:30px;}
.timeline .thumb {width:calc(25% - 25px); margin-right:25px;}
.timeline .thumb.mobile {width:35%; margin-right:45px;}
.timeline .thumb>img {width:100%; cursor: pointer; display:block; border:1px solid #eee;}
.timeline .thumb.mobile>img {border:none;}
.timeline .thumb>span {display:block; text-align:center; font-size:.85em; padding:5px;}

.img_copyright {width:500px;}
.img_help {border:1px solid #ddd;}
.img_help_btn {height:4rem;}

@media only screen and (max-width : 767px){
	.logo_font {width:100%; padding:8px 50px 20px 50px;}
	.ci-v {width:70px;}
	.ci-h {width:240px;}
	.ci {display:block; width:100%; padding:20px;}
	.ci li {text-align:center; padding:20px 0 0 0;}
	
	.timeline {margin-top:30px;}
	.timeline .thumb {width:calc(50% - 10px); margin-right:10px;}
	.timeline .thumb.mobile {width:100%; margin-right:0;}
	
	.img_copyright {width:80%;}
}