@charset "utf-8";

/* common */
#visual {
    position: relative;
    width: 100%; height: 520px;
    background: url(../img/sub1_visual_m.jpg) no-repeat center/cover;
}
.visInner h3 {
    position: absolute;
    top: 208px; left: 4.733%;
    font-size: 5.4rem; color: #fff;
}
.visInner h3 span {
    display: inline-block; margin: -6px;
    animation: 0.5s titAni;
    opacity: 0;
    animation-fill-mode: forwards;
}
.visInner h3 span:nth-child(2) {animation-delay: .2s;}
.visInner h3 span:nth-child(4) {animation-delay: .5s;}
.visInner h3 span:nth-child(5) {animation-delay: .2s;}
.visInner h3 span:nth-child(7) {animation-delay: .5s;}
@keyframes titAni {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
.visInner .sub {
    position: absolute;
    bottom: 48px; right: 33px;
}
.visInner .sub li a {
    position: relative;
    display: block;
    margin-top: 21px;
    font-size: 2rem; color: #fff;
    font-weight: 700;
    text-align: right;
    opacity: 0;
    animation: 0.5s subAni 0.4s forwards;
}
.visInner .sub li a.now:before {
    position: absolute;
    content: '';
    top: 50%; right: -20px; transform: translateY(-50%);
    width: 5px; height: 5px;
    border-radius: 3px;
    background: #fff;
}
@keyframes subAni {
    0% {opacity: 0; transform: translateY(8px);}
    100% {opacity: 1; transform: translateY(0);}
}
.tit {margin-bottom: 32px;}
.tit h3 {
	font-size: 4rem;
    margin-bottom: 17px;
    text-align: center;
}
.tit p {
	font-size: 2rem;
    line-height: 32px;
    font-weight: 300;
    color: #7d7d7d;
    text-align: center;
}

/** sub1 **/
/* sub1_1 WHY */
.intInner {padding: 80px 4.533% 23px;}
.intInner > h3 {
	font-size: 4rem;
    margin-bottom: 17px;
    text-align: center;
}
.intInner > p {
    font-size: 2rem;
    line-height: 32px;
    font-weight: 300;
    color: #7d7d7d;
    text-align: center;
}
.intInner .intro-wrap {margin-top: 15px;}
.intInner .intro-wrap .img {
	display: block;
    width: 100%;
    height: 260px;
	background: url(../img/sub1_intro_m.jpg) no-repeat center/contain;
}
.intInner .intro-wrap .intro_txt {
	position: relative;
	padding: 32px 1.53%;
}
.intInner .intro-wrap .intro_txt strong {
	font-size: 3.2rem;
	color: #154fa2;
}
.intInner .intro-wrap .intro_txt p {
	margin-top: 20px;
	font-size: 1.6rem;
	line-height: 1.5;
	white-space: pre-line;
}
.intInner .intro-wrap .intro_txt:after {
	content: '';
	position: absolute;
	bottom: 47px; right: 32px;
	width: 95px; height: 95px;
	background: url(../img/sub1_intro_txt_m.png) no-repeat center/cover;
}

/* sub1_1 about */
#about {
	padding: 52px 4.533% 55px;
    background: #f2f3f7;
}
.aboInner h3 {
	font-weight: 700;
	font-size: 2.5rem;
	line-height: 1.4;
	white-space: pre-line;
}
.aboInner p {
	font-size: 1.7rem;
	line-height: 1.6;
	white-space: pre-line;
}
.aboInner .color {
	font-weight: 700;
	color: #154fa2;
}
.aboInner .ceo {
	position: relative;
	margin-top: 67px;
	padding: 0 71px 0 0;
    text-align: right;
}
.aboInner .ceo:after {
	content: '';
	position: absolute;
	top:0; right: 0;
	width: 52px; height: 28px;
	background: url(../img/sub1_ceo_m.png) no-repeat center/cover;
}

/* sub1_2 기업이념 */
.priInner {
	padding: 52px 4.533% 55px;
}
.priInner > h3 {
	font-size: 4rem;
    margin-bottom: 17px;
    text-align: center;
}
.priInner > p {
    font-size: 2rem;
    line-height: 32px;
    font-weight: 300;
    color: #7d7d7d;
    text-align: center;
}
.priInner .ent-wrap .ent_tit, .priInner .ent-wrap .ent_txt {
    display: block;
    width: 100%;
    padding: 29px 15px;
}
.priInner .ent-wrap .ent-cont {
    margin: 10px 0;
    border: 1px solid #2c8380;
}
.priInner .ent-wrap .ent_tit {
    position: relative;
    padding: 30px 0 0 145px;
    text-align: left;
    height: 100px;
    background: #6fa9a5;
	color: #fff;
}
.priInner .ent-wrap .satis {padding: 20px 0 0 145px;}
.priInner .ent-wrap .ent_tit .icon {
    position: absolute;
    top: 50%;
    left: 13%;
	transform: translateY(-50%);
    width: 68px;
    height: 54px;
    overflow: hidden;
}
.priInner .ent-wrap .ent_tit .icon img {width: 100%;}
.priInner .ent-wrap .ent_tit h4 {
    width: 100%;
    margin: 0;
	font-size: 2rem
}
.priInner .ent-wrap .ent_tit p {
	margin-top: 10px;
	font-size: 1.6rem;
	font-weight: 400;
}
.priInner .ent-wrap .ent_txt p {
	font-size: 1.6rem;
	line-height: 1.3;
}

/* sub1_3 특허 및 인증서 */
.certInner {padding: 80px 4.533%;}
.certInner h4 {font-size: 2rem;}
.certInner h4:before {
	display: inline-block;
	content: '';
	margin-right: 5px;
	width: 6px; height: 22px;
	background: #0e2f73;
	vertical-align: -4px;
}
.certInner ul {margin-top: 24px;}
.certInner li {
	float: left;
	width: 49.5%;
	text-align: center;
}
.certInner li:nth-child(n+3) {margin-top: 25px;}
.certInner li:nth-child(2n) {float: right;}
.certInner li a {
	display: block;
	margin-bottom: 5px;
	cursor: default;
}
.certInner li p {font-size: 1.4rem; color: #1d1d1d;}
.certInner li a img {width: 100%;}	

/* sub1_4 조직도 */
.orgInner {padding: 80px 4.533%;}
.orgInner > h3 {
	font-size: 4rem;
    margin-bottom: 17px;
    text-align: center;
}
.orgInner > p {
    font-size: 2rem;
    line-height: 32px;
    font-weight: 300;
    color: #7d7d7d;
    text-align: center;
}
.orgInner .head {margin-top: 36px;}
.orgInner article i.img {
    display: block;
    width: 100%; height: 811px;
    margin-top: 42px;
    background: url(../img/sub1_4_cont1_m.png) no-repeat center/contain;
}

/*sub1_5 오시는길 */
.mapInner {padding: 72px 4.533% 110px;}
.mapInner h4 {margin-bottom: 27px; font-size: 3.6rem;}
.mapInner article .cont {padding-left: 49px;}
.mapInner article .cont p {
    position: relative;
    font-size: 1.6rem;
    line-height: 20px;
}
.mapInner article .cont p:before {
    position: absolute;
    content: '';
    left: -35px; top: 3px;
    width: 18px; height: 17px;
    background: url(../img/sub1_4_icon-tel.png) no-repeat center/contain;
}
.mapInner article .cont p.mail {margin-top: 24px;}
.mapInner article .cont p.mail:before {background-image: url(../img/sub1_4_icon-mail.png);}
.mapInner article.map {margin-top: 53px;}
.mapInner article .cont p.map {margin-bottom: 22px;}
.mapInner article .cont p.map:before {background-image: url(../img/sub1_4_icon-map.png);}
.mapInner iframe {width: 100%; height: 460px; border: 1px solid #333;}

/** sub2 **/
#visual.vis2 {background-image: url(../img/sub2_visual_m.jpg);}
.proInner {padding: 80px 0;}
.proInner .left-wrap {padding: 0 4.533%;}
.proInner .leftMenu {
	padding: 15px 6px;
	border: 1px solid #ddd;
	border-radius: 10px;
	margin-bottom: 40px;
}
.proInner .leftMenu li {float: left; width: 33.33%;}
.proInner .leftMenu li:nth-child(n+4) {margin-top: 11px;}
.proInner .leftMenu li a {
	display: block;
	font-size: 1.5rem; color: #a1a1a1;
	text-align: center;
}
.proInner .leftMenu li a.on {color: #154fa2; font-weight: 700;}
.proInner .right-wrap img {width: 100%;}
.proInner .right-wrap article {padding: 30px 4.533% 36px;}
.proInner .right-wrap article:nth-child(2n-1) {background: #f9f9fa;}
.proInner .right-wrap .cont-box {margin-top: 16px;}
.proInner .right-wrap .cont-box i {
	font-style: normal;
	font-size: 1.4rem;
}
.proInner .right-wrap .cont-box i:after {
	display: block;
	content: '';
	width: 85%; height: 1px;
	margin: 11px 0 12px;
	background: #ddd;
}
.proInner .right-wrap .cont-box h4 {font-size: 2rem; line-height: 1.3;}
.proInner .right-wrap .cont-box h4 span {
	display: block;
	font-size: 1.4rem;
	font-weight: 400;
}
.proInner .right-wrap .cont-box a {
	display: block;
	width: 180px; height: 42px;
	margin-top: 18px;
	font-size: 1.5rem; color: #fff;
	line-height: 41px;
	background: #00beb4;
	text-align: center;
}

/* sub2-detail */
.detInner {padding: 80px 4.533%;}
.detInner .detail-preview img {width: 100%;}
.detInner .preview-cont {margin-top: 36px;}
.detInner .preview-cont h4 {font-size: 2.4rem;}
.detInner .preview-cont h4 span {
	display: block;
	margin-top: 4px;
	font-size: 1.5rem;
	font-weight: 400;
}
.detInner li:after {clear: both; content: ''; display: block;}
.detInner .cont-more {margin-top: 26px;}
.detInner .cont-more table {
	width: 100%;
	border-spacing: 0;
	/*table-layout: fixed;*/
	border-top: 2px solid #0050b3;
	border-bottom: 1px solid #0050b3;
}
.detInner .cont-more th {
	height: 40px;
	font-size: 1.5rem;
	border-bottom: 1px solid #a0a0a0;
}
.detInner .cont-more td {
	padding: 0 6px;
	height: 36px;
	font-size: 1.4rem;
	text-align: center;
	border: 1px solid #e1e1e1;
	border-width: 1px 0 0 1px;
}
.detInner .cont-more tr:first-child td {border-top: 0;}
.detInner .cont-more .fr td:first-child {
	background: #f8f8f8;
	border-left: 0;
}
.detInner .detail-lists {margin-top: 55px;}
.detInner .detail-lists h4 {
	padding: 13px 0;
	font-size: 1.6rem; color: #fff;
	background: #0050b3;
	text-align: center;
}
.detInner .lists-wrap {
	padding: 35px 5%;
	background: #fafafa;
}
.detInner .lists-wrap li {
	padding-bottom: 10px;
	border-bottom: 1px solid #e3e3e3;
}
.detInner .lists-wrap li:nth-child(n+2) {margin-top: 14px;}
.detInner .lists-wrap li p {
	font-size: 1.6rem;
	word-break: keep-all;
}
.detInner .lists-wrap li p.tit {
	margin-bottom: 5px;
	font-weight: 700;
}
.detInner .lists-wrap li p.tit + p {
	color: #848484;
	line-height: 1.5;
	white-space: pre-line;
}
.detInner .detail-photos .pro-imgs {padding: 34px 0 0;}
.detInner .detail-photos img {
	display: block;
	max-width: 100%;
	margin: 0 auto;
}
.detInner .detail-photos img:nth-child(n+2) {margin-top: 24px;}

/** sub3 **/
#visual.vis3 {background-image: url(../img/sub3_visual_m.jpg);}


/** sub4 **/
/* sub4_1 공지사항 */
#visual.vis4 {background-image: url(../img/sub4_visual_m.jpg);}
.brdInner {padding: 80px 4.533%;}
.brdInner h3 {
    display: inline-block;
    margin-right: 20px;
    font-size: 3.2rem; font-weight: 400;
    vertical-align: middle;
}
.brdInner .qrCode {
    display: inline-block;
    width: 40px; height: 40px;
    background: #fff;
    vertical-align: middle;
    border: 1px solid #dbdbdb;
}
.brdInner .qrCode img {width: 40px; height: 40px;}
.brdInner .search {margin: 24px 0 14px;}
.brdInner .search input {
    width: 86%; height: 34px;
    padding-left: 8px;
    font-size: 1.4rem; color: #747474;
    background: none;
    border: 1px solid #333;
    outline: none;
}
.brdInner .search button {
    width: 13%; height: 34px;
    margin-left: -3px;
    font-size: 1.4rem; color: #fff;
    background: #3d3d3d;
    cursor: pointer;
    text-indent: 0;
    vertical-align: top;
}
.brdInner table {
    width: 100%; 
    border-spacing: 0;
    border-top: 2px solid #333;
    border-bottom: 1px solid #ababab;
}
.brdInner table th:last-child, .brdInner table td:last-child {display: none;}
.brdInner table th {
    height: 40px;
    font-size: 1.6rem;
    border-bottom: 1px solid #333;
    font-weight: 400;
}
.brdInner table th:first-child {width: 15.395%;}
.brdInner table th:nth-child(2) {width: 59.824%;}
.brdInner table th:nth-child(3) {width: 24.781%;}
.brdInner table td {
    height: 50px; padding: 5px 0;
    font-size: 1.5rem;
    text-align: center;
    border-bottom: 1px solid #ababab;
}
.brdInner table td a {color: #333;}
.brdInner .btn_wrap {text-align: center; margin-top: 26px;}
.brdInner .btn_wrap ul {display: inline-block;}
.brdInner .btn_wrap li {float: left;}
.brdInner .btn_wrap li a {
    display: block;
    margin: 0 3px;
    width: 34px; height: 34px;
    font-size: 1.4rem; color: #333;
    line-height: 32px;
    border: 1px solid #333;
    text-align: center;
}
.brdInner .btn_wrap li.on a {
    color: #fff;
	background: #333;
}

/* sub4_view 게시판 보기 */
.viewInner {padding: 80px 4.533%;}
.viewInner .title {text-align: center;}
.viewInner .title i {font-size: 1.2rem; color: #747474; font-style: normal;}
.viewInner .title p {
    margin: 8px 0 16px;
    font-size: 2.1rem;
    font-weight: 700;
}
.viewInner .title {border-bottom: 1px solid rgba(116,116,116,.3);}
.viewInner .cont {padding: 24px 6px;}
.viewInner .cont img {width: 100%; object-fit: cover;}
.viewInner .cont p {font-size: 1.5rem; line-height: 28px;}
.viewInner a.main {
    display: block;
    width: 130px; padding: 12px 0;
    margin: 0 auto;
    font-size: 1.4rem; color: #333;
    text-align: center;
    background: #fff;
    border-radius: 16px;
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,.05);
}


/*** PC ***/
@media screen and (min-width:1084px){
    /* common */
    #visual {
        height: 500px;
        background-image: url(../img/sub1_visual.jpg);
    }
    .visInner {width: 1280px; margin: 0 auto;}
    .visInner h3 {
        position: static;
        padding-top: 250px;
        font-size: 10rem;
    }
    .visInner h3 span {margin: -12px;}
    .visInner .sub {
        position: static; float: right;
        margin-top: 77px;
    }
    .visInner .sub li {float: left; margin-left: 41px;}
    .visInner .sub li a {
        margin: 0;
        display: inline-block;
        font-size: 2.4rem; color: #fff;
        transition: 0.5s;
    }
    .visInner .sub li a:hover {color: #bbb;}
    .visInner .sub li a.now:before {
        top: auto; right: auto; transform: translateY(0);
        bottom: -6px; left: 0;
        width: 100%; height: 3px;
        border-radius: 0;
    }
    .tit {margin-bottom: 48px;}
    .tit h3 {margin-bottom: 12px; font-size: 4rem;}
    .tit p {font-size: 1.6rem;}
    
    /** sub1 **/
    /* sub1_1 WHY */
    .intInner {padding: 174px 0 164px;}
	.intInner > h3 {
		font-size: 4rem;
		margin-bottom: 17px;
		text-align: center;
	}
	.intInner > p {
		font-size: 2rem;
		line-height: 32px;
		font-weight: 300;
		color: #7d7d7d;
		text-align: center;
	}
	.intInner .intro-wrap {
		width: 1280px;
		margin: 15px auto 0;
		text-align: center;
	}
	.intInner .intro-wrap .img {
		display: inline-block;
		width: 863px;
		height: 523px;
		margin-left: 245px;
		background: url(../img/sub1_intro.jpg) no-repeat center/contain;
	}
	.intInner .intro-wrap .intro_txt {
		float: left;
		margin-top: -25%;
		text-align: left;
	}
	.intInner .intro-wrap .intro_txt strong {
		font-size: 6.4rem;
		color: #154fa2;
		white-space: pre-line;
	}
	.intInner .intro-wrap .intro_txt p {
		margin-top: 20px;
		font-size: 3.2rem;
		line-height: 1.5;
		white-space: pre-line;
	}
	.intInner .intro-wrap .intro_txt:after {
		bottom: 47px; 
		right: -107px;
		width: 189px; 
		height: 189px;
	}

	/* sub1_1 about */
	.aboInner {
		width: 1280px;
		margin: 0 auto;
	}
	.aboInner h3 {
		float: left;
		font-size: 4.2rem;
	}
	.aboInner p {
		display: inline-block;
		margin-left: 148px;
	}
	.aboInner .color {
		font-weight: 700;
		color: #154fa2;
	}
	.aboInner .ceo {
		float: right;
		padding: 0 89px 0 0;
	}
	.aboInner .ceo:after {
		top: auto;
		bottom: 0;
		right: 0;
		width: 74px; height: 40px;
	}
    
    /* sub1_2 기업이념 */
    .priInner {
		padding: 174px 0 164px;
		width: 1280px;
		margin: 0 auto;
	}
	.priInner > h3 {
		font-size: 4rem;
		margin-bottom: 17px;
		text-align: center;
	}
	.priInner > p {
		font-size: 2rem;
		line-height: 32px;
		font-weight: 300;
		color: #7d7d7d;
		text-align: center;
	}
	.priInner .ent-wrap {margin-top: 104px;}
	.priInner .ent-wrap .ent-cont {display: flex;}
	.priInner .ent-wrap .ent_tit, .priInner .ent-wrap .ent_txt {padding: 30px; white-space: pre-line;}
	.priInner .ent-wrap .ent_tit {
		width: 515px; height: 126px;
		padding-left: 30px;
		background-color: #6fa9a5;
	}
	.priInner .ent-wrap .ent_tit .icon {left: 12%;}
	.priInner .ent-wrap .ent_tit h4 {
		display: inline-block;
		float:right;
		padding-left: 130px;
		margin-top: -10px;
	}
	.priInner .ent-wrap .ent_txt {width: 760px; padding: 23px 30px;}

	/* sub1_3 특허 및 인증서 */
	.certInner {padding: 129px 0 142px; width: 1280px; margin: 0 auto;}
	.certInner h4 {font-size: 1.6rem;}
	.certInner h4:before {
		margin-right: 6px;
		height: 21px;
		vertical-align: -5px;
	}
	.certInner li {
		width: 300px;
		margin-right: 22px;
	}
	.certInner li:nth-child(n+3) {margin-top: 0;}
	.certInner li:nth-child(n+5) {margin-top: 32px;}
	.certInner li:nth-child(2n) {float: left;}
	.certInner li:nth-child(4n) {margin-right: 0;}
	.certInner li a {margin-bottom: 19px;}
	.certInner li p {font-size: 1.6rem;}

	/* sub1_4 조직도 */
    .orgInner {padding: 129px 0 142px; width: 1280px; margin: 0 auto;}
	.orgInner > h3 {
		font-size: 4rem;
		margin-bottom: 17px;
		text-align: center;
	}
	.orgInner > p {
		font-size: 2rem;
		line-height: 32px;
		font-weight: 300;
		color: #7d7d7d;
		text-align: center;
	}
    .orgInner .head {margin-top: 54px;}
    .orgInner article i.img {
        height: 468px;
        margin-top: 16px;
        background-image: url(../img/sub1_4_cont1.png);
    }

    /*sub1_5 오시는길 */
    .mapInner {
		padding: 130px 0 142px;
		width: 900px;
		margin: 0 auto;	
	}
    .mapInner h4 {margin-bottom: 38px; font-size: 4rem;}
    .mapInner article .cont {padding-left: 62px;}
    .mapInner article.contact p {float: left;}
    .mapInner article .cont p:before {
        left: -46px; top: 50%; transform: translateY(-50%);
        width: 28px; height: 25px;
    }
    .mapInner article .cont p.mail {margin: 0 0 0 87px;}
    .mapInner article.map {margin-top: 92px;}
    .mapInner article .cont p.map {margin-bottom: 46px;}
    .mapInner iframe {height: 387px;}

    /** sub2 **/
    #visual.vis2 {background-image: url(../img/sub2_visual.jpg);}
	.proInner {
		padding: 135px 0 124px;
		width: 1280px; min-height: 760px;
		margin: 0 auto;
	}
	.proInner .product-wrap {position: relative;}
	.proInner .left-wrap {
		position: absolute;
		top: 0; left: -160px;
		padding: 0;
		width: 123px;
	}
	.proInner .leftMenu {
		padding: 26px 12px;
		margin-bottom: 0;
	}
	.proInner .leftMenu li {float: none; width: 100%;}
	.proInner .leftMenu li:nth-child(n+4) {margin-top: 0;}
	.proInner .leftMenu li:first-child a {padding: 0;}
	.proInner .leftMenu li a {
		padding: 17px 0 0;
		font-size: 1.6rem;
	}
	.proInner .leftMenu li a:after {
		display: block;
		content: '';
		width: 80px; height: 1px;
		margin: 17px auto 0;
		background: #ddd;
	}
	.proInner .right-wrap {
		float: right;
		width: 1280px;
	}
	.proInner .right-wrap .img-box {
		position: absolute;
		top: 0; right: 20px;
		width: 436px; height: 304px;
	}
	.proInner .right-wrap .img-box img {
		position: absolute;
		top: 50%; left: 50%; transform: translate(-50%,-50%);
		width: 94%;
	}
	.proInner .right-wrap article {
		position: relative;
		padding: 63px 0 52px 68px;
		min-height: 304px;
	}
	.proInner .right-wrap .cont-box {margin-top: 0;}
	.proInner .right-wrap .cont-box i {font-size: 1.6rem;}
	.proInner .right-wrap .cont-box i:after {
		width: 584px;
		margin: 22px 0 24px;
	}
	.proInner .right-wrap .cont-box h4 {font-size: 2.6rem; line-height: 1;}
	.proInner .right-wrap .cont-box h4 span {
		margin-top: 12px;
		font-size: 1.6rem;
	}
	.proInner .right-wrap .cont-box a {
		width: 135px; height: 43px;
		margin-top: 33px;
		font-size: 1.4rem;
		line-height: 42px;
	}

	/* sub2-detail */
	.detInner {
		padding: 135px 0 74px;
		width: 1280px; min-height: 840px;
		margin: 0 auto;
	}
	.detInner div.tit {margin-bottom: 87px;}
	.detInner .detail-preview .imgBox {
		display: inline-block;
		width: 626px; height: 366px;
		vertical-align: middle;
	}
	.detInner .preview-cont {
		display: inline-block;
		margin: 0 0 0 18px;
		padding-left: 31px;
		width: 626px;
		vertical-align: middle;
	}
	.detInner .preview-cont i.logo {
		display: none;
		width: 183px; height: 30px;
		margin-bottom: 30px;
		background: url(/img/logo_color.png) no-repeat center/contain;
	}
	.detInner .preview-cont h4 {font-size: 2.6rem;}
	.detInner .preview-cont h4 span {
		margin-top: 11px;
		font-size: 1.6rem;
	}
	.detInner .cont-more {margin-top: 48px;	}
	.detInner .cont-more  th {
		height: 43px;
		font-size: 1.6rem;
	}
	.detInner .cont-more  td {
		height: 38px;
		font-size: 1.5rem;
	}
	.detInner .cont-more li:nth-child(n+2) {margin-top: 31px;}
	.detInner .cont-more li p {font-size: 1.6rem; word-break: keep-all;}
	.detInner .cont-more li p.tit {
		display: inline-block;
		width: 104px;
		vertical-align: middle;
	}
	.detInner .cont-more li p {
		float: none;
		display: inline-block;
		vertical-align: middle;
	}
	.detInner .cont-more li p.tit + p {padding-left: 22px;}
	.detInner .cont-more li p.tit:after {
		top: 50%; right: 0px; transform: translateY(-50%);
		height: 25px;
	}
	.detInner .detail-lists {margin-top: 76px;}
	.detInner .detail-lists h4 {
		padding: 23px 0;
		font-size: 2rem;
	}
	.detInner .lists-wrap {padding: 45px 88px 66px;}
	.detInner .lists-wrap li {padding: 31px 0;}
	.detInner .lists-wrap li:nth-child(n+2) {margin-top: 0;}
	.detInner .lists-wrap li p {
		float: left;
		line-height: 1.6;
	}
	.detInner .lists-wrap li p.tit {
		padding-left: 38px;
		margin-bottom: 0;
		font-size: 2rem;
		font-weight: 700;
		width: 203px;
	}
	.detInner .lists-wrap li p.tit + p {
		font-size: 1.8rem;
		width: 897px;
		line-height: 1.6;
	}
        
    /** sub3 **/
    #visual.vis3 {background-image: url(../img/sub3_visual.jpg);}
    
    /** sub4 **/
    /* sub4_1, sub4_2 자료실, 홍보자료 */
    #visual.vis4 {background-image: url(../img/sub4_visual.jpg);}
    .brdInner {padding: 130px 0 122px; width: 1200px; margin: 0 auto;}
    .brdInner h3 {
        margin-right: 40px;
        font-size: 4rem; font-weight: 700;
    }
    .brdInner .qrCode {width: 54px; height: 54px;}
    .brdInner .qrCode img {width: 54px; height: 54px;}
    .brdInner .search {
        float: right;
        width: 275px;
        margin: 24px 0;
    }
    .brdInner .search input {
        width: 218px; height: 28px;
        padding-left: 12px;
        font-size: 1.6rem;
    }
    .brdInner .search button {
        width: 57px; height: 28px;
        font-size: 1.6rem;
    }
    .brdInner table {
        width: 100%;
        margin-top: 32px;
        word-break: break-all;
    }
    .brdInner table th:last-child, .brdInner table td:last-child {display: table-cell;}
    .brdInner table th {
        height: 46px;
        font-size: 1.8rem;
    }
    .brdInner table th:first-child {width: 90px;}
    .brdInner table th:nth-child(2) {width: 535px;}
    .brdInner table th:nth-child(3) {width: 140px;}
    .brdInner table th:nth-child(4) {width: 135px;}
    .brdInner table td {
        height: 50px; padding: 7px 0;
        font-size: 1.6rem; color: #666;
        text-align: center;
        border-bottom: 1px solid #ababab;
    }
    .brdInner table tbody tr:hover td {background: #eee;}
	.brdInner table tbody td a {color: #333;}
    .brdInner table tbody tr td {cursor: pointer;}
    .brdInner .btn_wrap {margin-top: 52px;}
    .brdInner .btn_wrap li a {
        margin: 0 4px;
        width: 36px; height: 36px;
        font-size: 1.6rem;
        line-height: 34px;
    }
    
    /* sub4_view 게시판 보기 */
    .viewInner {padding: 130px 0 136px; width: 1200px; margin: 0 auto;}
    .viewInner .navi {
        position: relative;
        float: left;
        width: 218px;
    }
    .viewInner .navi li a {
        display: block;
        font-size: 4rem; color: #333;
        margin-bottom: 56px;
    }
    .viewInner .navi li a.on {font-weight: 700;}
    .viewInner .navi li.code a {
        position: absolute;
        margin: 0;
        bottom: 0; right: 50px;
        width: 150px; height: 150px;
        background: #fff;
        border: 1px solid #dbdbdb;
    }
    .viewInner .navi li.code a img {width: 150px; height: 150px; object-fit: cover;}
    .viewInner .title {position: relative;}
    .viewInner .title i {font-size: 1.4rem;}
    .viewInner .title p {
        margin: 16px 0 41px;
        font-size: 2.4rem;
    }
    .viewInner .title .file {
        position: absolute;
        bottom: 12px; right: 0;
    }
    .viewInner .title .file span {
        display: inline-block;
        font-size: 1.4rem; color: #747474;
        margin-right: 14px;
        vertical-align: middle;
    }
    .viewInner .title .file a {
        display: inline-block;
        width: 27px; height: 21px;
        background: url(../img/sub4_file.png) no-repeat center/contain;
        vertical-align: middle;
    }
    .viewInner .cont {padding: 24px 6px; min-height: 350px;}
    .viewInner .cont p {font-size: 1.6rem;}
    .viewInner a.main {
        width: 154px; padding: 14px 0;
        font-size: 1.6rem;
        border-radius: 32px;
        box-shadow: none;
        transition: 0.6s;
    }
    .viewInner a.main:hover {
        transform: translate(-1px,-2px);
        box-shadow: 1px 2px 2px 2px rgba(0,0,0,.07);
    }
    
    
    /* active */
    .coInner article.active .text {visibility: visible; opacity: 1;}
    .coInner article.remove {visibility: hidden; opacity: 0;}
    .coInner article.citizen.active {transform: translateX(-564px);}
    .coInner article.citizen.active .text {transition: .5s .4s;}
    
    .coInner .text b {
        margin: 0 0 34px;
        font-size: 2.4rem;
    }
    .coInner .text p {
        margin-top: 26px;
        font-size: 1.6rem; line-height: 24px;
    }
    .gistInner {padding: 140px 0 120px; width: 1280px; margin: 0 auto;}
    .gistInner .tit {text-align: left;}
    .gistInner article {
        padding: 50px 80px;
        background-image: url(../img/sub4_3_gist1.jpg);
    }
    .gistInner article span.img {
        display: inline-block;
        width: 380px; height: 260px;
        background-image: url(../img/sub4_3_gist1img.jpg);
        vertical-align: middle;
    }
    .gistInner article span.mobile {display: none;}
    .gistInner article .text {
        display: inline-block;
        width: 585px;
        margin: 0 54px;
        vertical-align: middle;
    }
    .gistInner article.citizen {margin-top: 9px;}
    .gistInner article.citizen .text {text-align: right;}
    .gistInner article h4 {
        margin: 0 0 22px;
        font-size: 2.4rem;
    }
    .gistInner article p {
        margin-top: 8px;
    }
    .gistInner article.citizen {background-image: url(../img/sub4_3_gist2.jpg);}
    .gistInner article.citizen .img {background-image: url(../img/sub4_3_gist2img.jpg);}
    #keyword {background: #fff;}
    .kwInner {padding: 60px 0 46px; margin-bottom: 110px;}
    .kwInner b {width: 230px; margin-right: 150px; vertical-align: middle;}
    .kwInner p {white-space: pre-line; vertical-align: middle;}
}