@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	" board｜errors｜goods｜service｜layout/board｜layout/display｜layout/goods "
	" layout/popup.html "

	위 폴더 및 페이지 커스텀 및 layout, navigation, button, company 관련 편집 css 파일 입니다.

	** header, footer, main 관련은 /css/skin.css 에 있습니다.

───────────────────────────────────────────────────────────*/








/*───────────────────────────────────────────────────────────
	
	common.css 커스텀 css 아래에 작성

───────────────────────────────────────────────────────────*/

/*───────────────────────────────────────────────────────────
	font common
───────────────────────────────────────────────────────────*/
	/** PC 일반 **/
		body {}/*letter-spacing:-0.2px;*/
		div, dd, li, p, span, td, dt, h1, h2, h3, h4, h5, h6, strong, b, em, th {}
		b, dt, strong, em, th, h1, h2, h3, h4, h5, h6 {font-weight:700;}/* Noto Sans KR은 500 사용 */
		input, button, textarea, select {}
			/* webfont */
		.ff_open {font-family: 'Open Sans', 'Nanum Gothic', sans-serif !important;}
		.ff_noto {font-family: "Noto Sans KR", 'Nanum Gothic', sans-serif !important;}
		.ff_mont {font-family: 'Montserrat', 'Nanum Gothic', sans-serif !important;}
		.ff_nanum {font-family: 'Lato','Nanum Gothic', dotum, sans-serif !important;}
		.ff_lato {font-family: 'Lato', 'Nanum Gothic', sans-serif !important;}
		.ff_nbg {font-family: 'Nanum Barun Gothic','Nanum Gothic', sans-serif !important;}
		.ff_open, .ff_open a, .ff_open span, .ff_open div, .ff_open ul, .ff_open li, .ff_open p {font-family: 'Open Sans' !important;}
		.ff_noto, .ff_noto a, .ff_noto span, .ff_noto div, .ff_noto ul, .ff_noto li, .ff_noto p {font-family: 'Noto Sans KR', 'Noto Sans' !important; font-weight:400;}
			/* font weight */
		.fw_t {font-weight:300;}
		.fw_n {font-weight:400;}
		.fw_b {font-weight:700;}/* Noto Sans KR은 500 사용 */
		.fw_eb {font-weight:800;}/* Noto Sans KR은 700 사용 */


		/*** common ***/


		/*** TABLE | 서브페이지 전체 사용 ( board / member / layout ) ***/


		/*** BOARD ***/


		/*** GOODS ***/


		/*** MEMBER ***/


		/*** SERVICE ***/


/*───────────────────────────────────────────────────────────
	
	sub visual

───────────────────────────────────────────────────────────*/
	.sub_vis{width:100%;height:240px;box-sizing:border-box;position: relative;}
	.sub_vis h2{font-size:60px;color:#fff;font-weight:700;position: absolute;top:50%;left:50%;transform:translate(calc(-50% - 0.5px), calc(-50% - 0.5px));}	

	@media only screen and (max-width:1024px){
		.sub_vis{height:0;padding-bottom:25%;}
		.sub_vis h2{font-size:50px;}
	}
	@media only screen and (max-width:640px){
		.sub_vis{padding-bottom:28%;}
		.sub_vis h2{font-size:40px;}
	}
	@media only screen and (max-width:500px){
		.sub_vis{padding-bottom:33%;}
		.sub_vis h2{font-size:32px;}
	}

    
/*───────────────────────────────────────────────────────────

	SIDE_BOX | outline/left_bbs.html｜outline/left_goods.html｜outline/left_member.html｜outline/left_service.html

───────────────────────────────────────────────────────────*/
    #side_box {position: relative; border-bottom: 1px solid var(--border-color01);}
    #side_box:not(:has(dl dd:nth-child(3))){display:none;}
    #side_box dl{display: flex; justify-content: center; font-size: var(--title-20);}
    #side_box dl dt{display: none;}
    #side_box dl dd{width: 100%;}
    #side_box dl dd a{position: relative; display: flex ; align-items: center; justify-content: center; width: 100%; height: 60px; font-size: 85%; font-weight: 400; color: var(--black-color06); line-height: 1.4; padding:0 10px; box-sizing: border-box; transition: all 0.4s;}
    #side_box dl dd.on a{font-weight: 700; color: var(--point-color01); background: linear-gradient(180deg, #169EDB 0%, #004098 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
        #side_box dl dd a:before{position: absolute; content:''; width: 0; height: 2px; background: var(--point-gradient); left:0; bottom:-1px; transition: all 0.4s;}
        #side_box dl dd.on a:before{width: 100%;}

        /* over */
            @media (hover:hover){
                #side_box dl dd a:hover{color: var(--point-color04);}
            }

    @media screen and (max-width:860px){
        #side_box dl dd a{height: 55px;}
    }
    @media screen and (max-width:479px){
        #side_box dl dd a{height: 50px;}
    }

        
/*───────────────────────────────────────────────────────────
	
	sub title

───────────────────────────────────────────────────────────*/
	.sub_title{text-align: center;margin-top:68px; font-size: var(--title-20);}
	.sub_title h3{font-size:50px;color:#111;font-weight:400;line-height:1.2;}
        .sub_title h3.hd{margin-bottom: 51px;}
	.sub_title h3 span{display: block;font-size:40px;color:inherit;font-weight:inherit;margin-bottom:14px;}
	.sub_title h3 strong{font-size:inherit;color:inherit;font-weight:600;}
    .sub_title h6{font-size: 120%;font-weight: 500;color: var(--black-color03);line-height: 1.58;letter-spacing: -0.05em;}
        .sub_title h6.arw:before{display: inline-flex;content:'';width: 28px;aspect-ratio: auto 1;background: url('../images/sub/title_arw.svg') no-repeat center / 100% auto;margin-right: 12px;vertical-align: text-top;}
    .sub_title h6 em{font-weight: inherit; color: var(--point-color01);}
	.sub_title p{font-size:28px;color:#333;font-weight:400;margin-top:32px;}
	.sub_title > span{display: block;font-size:16px;color:#333;font-weight:400;line-height:1.8;margin-top:38px;}
    .sub_title > span + h6{margin-top: 20px;}

	@media only screen and (max-width:1024px){
		.sub_title{margin-top:45px;}
		.sub_title h3{font-size:40px;}
		.sub_title h3 span{font-size:30px;}
        .sub_title h6.arw:before{width: clamp(23px, 3.3vw, 28px);margin-right: clamp(10px, 1.7vw, 12px);}
		.sub_title p{font-size:22px;margin-top:20px;}
        .sub_title > span + h6{margin-top: clamp(15px, 2vw, 20px);}
	}
	@media only screen and (max-width:860px){
		.sub_title h3{font-size:32px;}
		.sub_title h3 span{font-size:24px;}
		.sub_title p{font-size:18px;}
		.sub_title > span br{display: none;}
	}
	@media only screen and (max-width:500px){
		.sub_title{margin-top:25px;}
		.sub_title h3{font-size:26px;}
		.sub_title h3 span{font-size:20px;margin-bottom:10px;}
        .sub_title h6{font-size: 110%;}
		.sub_title p{font-size:16px;margin-top:15px;}
		.sub_title > span{font-size:14px;margin-top:15px;}
	}
	

/*───────────────────────────────────────────────────────────
	button common
───────────────────────────────────────────────────────────*/
	/** PC 일반 **/
		/* custom button type */
			/* button 공통 요소 */
		.btn, .btn_lg, .btn_sm, .btn_md {font-weight:700;border-style:solid !important;border-width:1px !important;padding:0;margin:0;text-indent:0;vertical-align:top !important;text-align:center;display:inline-block;box-sizing:border-box;cursor:pointer;box-shadow:none;outline:0 !important;}
			/* button 크기별 */
		.btn_wd {width:100%;height:50px;line-height:48px;font-size:17px;}
		.btn {width:108px;height:40px;line-height:38px;font-size:15px;}
		.btn_lg {width:92px;height:72px;line-height:70px;font-size:14px;}
		.btn_md {width:60px;line-height:28px;height:30px;font-size:13px;}
		.btn_sm {height:30px;line-height:28px;width:auto !important;padding:0 8px;font-size:inherit;border-color:#aaa !important;background-color:#aaa !important;color:#fff !important;}
			/* button 색상별 */
		.btn_point{width:200px;height:60px;box-sizing:border-box;border-radius:10px;color:#fff;display: inline-flex;align-items: center;justify-content: center;background: linear-gradient(87deg, #169EDB 2.57%, #004098 98.21%);font-size:16px;font-weight:600;}
		.btn_basic, .btn_basic:hover {border-color:#777 !important;background-color:#777 !important;color:#fff !important;}
		.btn_default, .btn_default:hover {border-color:#aaa !important;background-color:#aaa !important;color:#fff !important;}
		.btn_info, .btn_info:hover {border-color:#d3d3d3 !important;background-color:#fff !important;color:#555 !important;}
			/* button wrapper */
		.btn_wrap {margin:0 auto;padding:0;padding-top:60px;font-size:0;vertical-align:top;display:inline-block;}
		.btn_wrap.ta_center {width:100%;}
		.btn_wrap a + a,
		.btn_wrap button + button,
		.btn_wrap a + button,
		.btn_wrap button + a {margin-left:12px;vertical-align:top;}
		.btn_wrap button > a, .btn_wrap a > a{margin-left:0;}
		.view_btn .btn_wrap.ta_right {position:absolute;right:0px;top:0px;}

	@media only screen and (max-width:1200px) {
			/* button wrapper */
	}
	@media only screen and (max-width:1024px) {
			/* button wrapper */
		.view_btn .btn_wrap.ta_left {position:absolute;left:0px;top:0px;}
	}
	@media only screen and (max-width:860px) {

	}
	@media only screen and (max-width:767px) {
			/* button wrapper */
	}
	@media only screen and (max-width:640px) {
			/* button wrapper */
		.btn_wrap {padding-top:40px;}
		.btn_wrap a + a,
		.btn_wrap button + button,
		.btn_wrap a + button,
		.btn_wrap button + a {margin-left:8px;}
	}
	@media only screen and (max-width:479px) {
			/* button 크기별 */
		.btn_wd {font-size:16px;}
		.btn {width:70px;font-size:13px;}
		.btn_lg {width:72px;font-size:13px;}
		.btn_md {width:60px;font-size:12px;}
		.btn_sm {padding:0 4px;font-size:12px;}
			/* button wrapper */
		.btn_wrap a + a,
		.btn_wrap button + button,
		.btn_wrap a + button,
		.btn_wrap button + a {margin-left:6px;}
		.view_btn .paging {width:100%;min-height:87px;}
		.view_btn .paging + .btn_wrap.ta_right{top:70px;}

		.btn_point{width:140px;height:50px;font-size:14px;}
	}
	@media only screen and (max-width:320px) {
			/* button 크기별 */
		.btn {width:68px;}
		.btn_md {width:44px;font-size:12px;}
	}

/*───────────────────────────────────────────────────────────

	company

───────────────────────────────────────────────────────────*/
	.sub_about .about_list{display: flex;flex-wrap:wrap;justify-content: space-between;text-align: center;margin-top:76px;}
	.sub_about .about_list li{box-sizing:border-box;width:25%;}
	.sub_about .about_list .icon{width:220px;height:220px;position: relative;overflow:hidden;box-sizing:border-box;background: #f5f5f5;border-radius:100%;margin:0 auto;display: flex;align-items: center;justify-content: center;}	
	.sub_about .about_list dl{margin-top:34px;}
	.sub_about .about_list dt strong{font-size:24px;color:#111;font-weight:600;display: block;}	
	.sub_about .about_list dt span{font-size:18px;color:#888;font-weight:400;display: block;}
	.sub_about .about_list dd{font-size:15px;color:#333;font-weight:400;margin-top:24px;line-height:1.6;}

	@media only screen and (max-width:1200px) {
		.sub_about .about_list{width:calc(100% + 30px);margin-left:-15px;}
		.sub_about .about_list li{margin:0 15px;width:calc(25% - 30px);}
		.sub_about .about_list .icon{width:100%;height:0;padding-bottom:100%;}
		.sub_about .about_list .icon div{width:100%;height:100%;position: absolute;top:0;left:0;display: flex;align-items: center;justify-content: center;}
		.sub_about .about_list dt strong{font-size:20px;}
		.sub_about .about_list dt span{font-size:16px;}
		.sub_about .about_list dd{font-size:14px;margin-top:12px;}
		.sub_about .about_list dd br{display: none;}
	}
	@media only screen and (max-width:860px) {
		.sub_about .about_list{margin-top:50px;}
		.sub_about .about_list .icon img{max-height:60px;}
		.sub_about .about_list dl{margin-top:20px;}
		.sub_about .about_list dt strong{font-size:18px;}
		.sub_about .about_list dt span{font-size:15px;}
	}
	@media only screen and (max-width:640px) {
		.sub_about .about_list{width:calc(100% + 15px);margin-left:-7.5px;}
		.sub_about .about_list li{margin:0 7.5px 25px;width:calc(50% - 15px);}
		.sub_about .about_list .icon{width:65%;padding-bottom:65%;}
	}
	@media only screen and (max-width:500px) {
		.sub_about .about_list{margin-top:40px;}
		.sub_about .about_list .icon{width:80%;padding-bottom:80%;}

	}

/*───────────────────────────────────────────────────────────

	product

───────────────────────────────────────────────────────────*/
	#wrap .prd_sub_title{margin-top:140px;}
	#wrap .sub_product .intro{margin-top:65px;}
	#wrap .sub_product .intro .img{text-align: center;}
	#wrap .sub_product .intro img{width:95%;margin:0 auto;}
	#wrap .sub_product .intro p{text-align: center;font-size:16px;color:#333;font-weight:400;line-height:1.9;margin-top: 40px;}
    #wrap .sub_product .intro .more_arw{margin-top: 30px;}

	#wrap .sub_product .prototype{box-sizing:border-box;margin-top:54px;padding: 0 0 95px;}
	#wrap .sub_product h4{text-align: center;font-size:50px;color:#111;font-weight:600;}
	#wrap .sub_product .prototype .img_box{text-align: center;margin-top:60px;}
	#wrap .sub_product .prototype .img_box .img{width:60%;margin:0 auto;box-sizing:border-box;border:1px solid #ddd;}
	#wrap .sub_product .prototype .img_box .img img{}
	#wrap .sub_product .prototype .img_box p{text-align: center;font-size:16px;color:#333;font-weight:400;line-height:1.9;margin-top:40px;}

	#wrap .sub_product .prototype .list{display: flex;flex-wrap:wrap;width:calc(100% + 30px);margin-left:-15px;margin-top:53px;}
	#wrap .sub_product .prototype .list li{box-sizing:border-box;margin:0 15px;width:calc(33.3333% - 30px);}
	#wrap .sub_product .prototype .list li .img{width:100%;box-sizing:border-box;height:0;padding-bottom:73%;background: #fff;border:1px solid #ddd;position: relative;overflow:hidden;}
	#wrap .sub_product .prototype .list li .img img{width:97%;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);max-height:initial;}
	#wrap .sub_product .prototype .list dl{margin-top:14px;}
	#wrap .sub_product .prototype .list dl dt{font-size:18px;color:#000;font-weight:500;}
	#wrap .sub_product .prototype .list dl dd{font-size:14px;color:#888;font-weight:400;margin-top:7px;}

	.prd_article{margin-top:80px;}
	.prd_article .list{box-sizing:border-box;border:1px solid #ddd;border-radius:20px;padding:50px 140px;counter-reset:num;margin-top:30px;}
	.prd_article .list li{counter-increment:num;display: flex;flex-wrap:wrap;box-sizing:border-box;}
	.prd_article .list li:nth-child(n+7){align-items: center;}
	.prd_article .list li + li{margin-top:30px;}	
	.prd_article .list li:nth-child(7){border-top:1px solid #d9d9d9;margin-top:69px;padding-top:69px;}
	.prd_article .list li:before{content:counter(num);width:40px;height:40px;box-sizing:border-box;border-radius:100%;background: #004098;display: inline-flex;align-items: center;justify-content: center;font-size:16px;color:#fff;font-weight:700;}
	.prd_article .list li:nth-child(n+7):before{background: #20AEE5;}
	.prd_article .list li .txt{width:calc(100% - 40px);box-sizing:border-box;padding-left:30px;}
	.prd_article .list li .txt p{font-size:16px;color:#666;font-weight:400;line-height:1.8;}
	.prd_article .list li .txt strong{display: block;font-size:20px;color:#333;font-weight:600;}
	.prd_article .list li .txt strong span{font-size:inherit;color:inherit;font-weight:inherit;font-style:italic;}
	.prd_article .list li:nth-child(n+7) .txt p{font-size:18px;color:#333;font-weight:400;}


    .sub_product .sers{background: var(--gray-bg); padding-block: 100px; margin-top: 100px;}
    .sub_product .sers .sub_title{margin-top: 0;}
    .gab_box{display: grid; gap: 40px;}
        .gab_box.gb60{gap: 60px;}
    .gab_box + .gab_box{margin-top: 60px;}
    .pdimg_box{padding:40px; background: var(--point-white); border-radius: 20px; box-sizing: border-box;}
    .txtimg_desc{border-radius: 20px; overflow: hidden; font-size: var(--title-20);}
    .txtimg_desc dt{font-size: 110%;font-weight: 500;color: var(--point-white);line-height: 1.63;text-align: center;background: var(--point-color04);box-sizing: border-box;padding: 17px 20px;}
    .txtimg_desc dd{position: relative;padding:40px;background: var(--point-white);box-sizing: border-box;}
    .txtimg_desc dd:before{position: absolute;content:'';inset: 0;border: 1px solid var(--border-color01);border-top:0;border-radius: 0 0 20px 20px;}
    .more_arw{width: fit-content;margin-inline: auto;font-size: var(--title-20);display: flex;align-items: center;justify-content: center;gap: 6px 12px;text-align: center;flex-wrap: wrap;}
    .more_arw span{font-size: max(14px, 80%);font-weight: 600;color: var(--point-color02);}
    .more_arw:after{display: inline-flex;content:'';width: 24px;aspect-ratio: auto 1;background: url('../images/sub/more_arw.svg') no-repeat center / 100% auto;}

    .chart_list{position: relative; display: flex; justify-content: center; box-sizing: border-box;}
    .chart_list > li{position: relative; display: flex; flex-direction: column; gap: 16px; font-size: var(--title-20); text-align: center;}
    .chart_list .thumb{display: block; border-radius: 10px; overflow: hidden;}
    .chart_list .txt{font-size: inherit; font-weight: 500; color: var(--black-color03);}

    .chart_list.type02{display: grid;gap: 30px clamp(15px, 1.25vw, 24px);grid-template: auto / repeat(4, 1fr);padding-top: 80px;margin-top: 14px;}
    .chart_list.type02:before{position: absolute; content:''; width: 1px; height: 40px; background: var(--border-color01); left:50%;}
    .chart_list.type02 > li:before{position: absolute;content:'';width: 1px;height: 40px;background: var(--border-color01);left: calc(50% - 1px);bottom:100%;}
    .chart_list.type02 > li:after{position: absolute;content:'';width: calc(100% + clamp(15px, 1.25vw, 24px));height: 1px;left:50%;bottom:calc(100% + 40px);background: var(--border-color01);}
	.chart_list.type02 > li:last-child:after{display:none;}
	.chart_list.type02 .txt{font-size:90%;font-weight: 400;}

    .info_table{position: relative;width: 100%;box-sizing: border-box;border-top: 1px solid var(--black-color01);border-bottom: 1px solid var(--border-color01);}
    .info_table table{position: relative;width: 100%;box-sizing: border-box;font-size: var(--title-20);text-align: center;line-height: 1.625;overflow: hidden;}
    .info_table thead th{background: var(--point-color06);}
    .info_table :where(th, td){box-shadow: 1px 1px 0 var(--border-color01);padding: 15px 10px;}
    .info_table th{font-size: 90%;font-weight: 600;color: var(--black-color01);}
    .info_table td{font-size: 80%;font-weight: 400;color: var(--black-color03);padding-block: 17px;}
    .info_table td small{display: block;font-size: inherit;color: var(--black-color06);}
    .info_table td em{font-weight: inherit; color: var(--point-color05);}
    .table_noti{font-size: var(--title-20);}
    .table_noti p{font-size: max(13px, 70%); font-weight: 400; color: var(--black-color08); margin-top: 16px;}
    .table_noti p em{font-weight: inherit; color: var(--point-color05);}
    

	@media only screen and (max-width:1024px){
		#wrap .prd_sub_title{margin-top:100px;}
		#wrap .sub_product .intro p{margin-top: 30px;}
        #wrap .sub_product .intro .more_arw{margin-top: clamp(15px, 3vw, 30px);}

		#wrap .sub_product .prototype{padding: 0 0 86px;}
		#wrap .sub_product .prototype .img_box{margin-top:30px;}
		#wrap .sub_product .prototype .img_box .img{width:70%;}

		.prd_article .list{padding:50px 30px;}
		.prd_article .list li br{display: none;}

        .gab_box{gap: clamp(25px, 4vw, 40px);}
            .gab_box.gb60{gap: clamp(40px, 6vw, 60px);}
            .gab_box + .gab_box{margin-top: clamp(40px, 6vw, 60px);}
        .pdimg_box{padding:clamp(25px, 4vw, 40px);}
        .txtimg_desc dd{padding:clamp(25px, 4vw, 40px);}
        .more_arw:after{width: clamp(20px, 2.9vw, 20px);}
        .chart_list > li{gap: clamp(12px, 1.6vw, 16px);}

        .info_table th{padding-block: clamp(12px, 2vw, 15px);}
        .info_table td{padding-block: clamp(12px, 2.2vw, 17px);}
	}
	@media only screen and (max-width:860px){
		#wrap .sub_product .intro p br{display: none;}
		#wrap .sub_product h4{font-size:36px;}

		#wrap .sub_product .prototype .img_box .img{width:85%;}
		#wrap .sub_product .prototype .img_box p br{display: none;}
	}
	@media only screen and (max-width:640px){
		#wrap .prd_sub_title{margin-top:70px;}
		#wrap .sub_product .intro p{margin-top:25px;font-size:14px;}
		
		#wrap .sub_product .prototype{padding: 0 0 40px;}
		#wrap .sub_product h4{font-size:28px;}
		#wrap .sub_product .prototype .img_box{margin-top:12px;}
		#wrap .sub_product .prototype .img_box .img{width:100%;}
		#wrap .sub_product .prototype .img_box p{font-size:14px;margin-top:15px;}

		#wrap .sub_product .prototype .list{width:calc(100% + 15px);margin-left:-7.5px;margin-top:30px;}	
		#wrap .sub_product .prototype .list li{margin:0 7.5px 20px;width:calc(50% - 15px);}
		#wrap .sub_product .prototype .list dl{margin-top:10px;}
		#wrap .sub_product .prototype .list dl dt{font-size:16px;}
		#wrap .sub_product .prototype .list dl dd{font-size:13px;margin-top:4px;}

		.prd_article{margin-top:50px;}
		.prd_article .list{padding:30px 15px;}
		.prd_article .list li:nth-child(7){margin-top:25px;padding-top:25px;}
		.prd_article .list li + li{margin-top:20px;}
		.prd_article .list li:before{width:30px;height:30px;font-size:14px;}
		.prd_article .list li .txt{width:calc(100% - 30px);padding-left:15px;}
		.prd_article .list li .txt p{font-size:14px;line-height:1.5;}
		.prd_article .list li:nth-child(n+7) .txt p{font-size:15px;}
		.prd_article .list li .txt strong{font-size:17px;}
		
        .pdimg_box, .txtimg_desc{border-radius: 10px;}
		.txtimg_desc dd:before{border-radius:0 0 10px 10px;}
        .chart_list .thumb{border-radius: 10px;}
        .chart_list.type02{grid-template:auto / repeat(2, 1fr);}
        .chart_list.type02 > li:nth-child(n+3):before{display: none;}
        .chart_list.type02 > li:nth-child(n+2):after{display: none;}
	}
	@media only screen and (max-width:500px){
		#wrap .sub_product .intro p{font-size:13px;line-height:1.7;}

		#wrap .sub_product h4{font-size:24px;}
		#wrap .sub_product .prototype .img_box p{font-size:13px;line-height:1.7;}
		#wrap .sub_product .prototype .list dl dt{font-size:14px;}
		#wrap .sub_product .prototype .list dl dd{font-size:12px;margin-top:0;}

		.prd_article .list{margin-top:10px;}
	}

/*───────────────────────────────────────────────────────────

	 board write

───────────────────────────────────────────────────────────*/
	.sub_board .table_box{margin-top:80px;}
	.sub_board .table_box .title{box-sizing:border-box;border-bottom:1px solid #ddd;display:flex;padding-bottom:24px;margin-bottom:15px;flex-wrap:wrap;justify-content:space-between;align-items:center;}
	.sub_board .table_box .title h3{font-size:30px;color:#111;font-weight:500;display:flex;align-items:baseline;}
	.sub_board .table_box .title h3 span{font-size:16px;color:#ddd;font-weight:400;display: inline-block;margin-left:10px;}
	.sub_board .table_box .title em{font-size:14px;color:#888;font-weight:500;}
	.sub_board .table_box .title em strong{font-size:8px;color:#20AEE5;font-weight:inherit;display: inline-block;margin-right:12px;}

	.sub_board .table_box .bbs_write{box-sizing:border-box;}
	.sub_board .table_box .bbs_write .bbs_tr{display:flex;flex-wrap:wrap;}
	.sub_board .table_box .bbs_write .bbs_tr dl{display:flex;width:100%;box-sizing:border-box;align-items:center;padding:15px 0;}
	.sub_board .table_box .bbs_write .bbs_tr dl + dl{margin-left:104px;}
	.sub_board .table_box .bbs_write .bbs_tr.row2 dl{width:calc(50% - 52px);}
	.sub_board .table_box .bbs_write .bbs_tr dl dt, .sub_board .table_box .bbs_write .bbs_tr dl dd{box-sizing:border-box;}
	.sub_board .table_box .bbs_write .bbs_tr dl dt{font-size:20px;color:#111;font-weight:500;width:126px;}	
	.sub_board .table_box .bbs_write .bbs_tr dl dt.req:after{width:6px;height:6px;content:"";box-sizing:border-box;border-radius:100%;background: #20AEE5;display: inline-block;vertical-align:top;margin-left:3px;margin-top:3px;}
	.sub_board .table_box .bbs_write .bbs_tr dl dd{width:calc(100% - 126px);padding-left:30px;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input[type="text"], #wrap .sub_board .table_box .bbs_write .bbs_tr dl dd select{box-sizing:border-box;width:100%;border:1px solid #ddd;border-radius:4px;height:40px;padding:0 15px;font-size:14px;color:#333;font-weight:400;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd select{appearance:none;background: #fff url('../images/sub/board_sel_arw.png')no-repeat right 16px center;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input[type="text"]::placeholder, #wrap .sub_board .table_box .bbs_write .bbs_tr dl dd select::placeholder{color:#aaa;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input[type="text"]:focus, #wrap .sub_board .table_box .bbs_write .bbs_tr dl dd select:focus{border-color:#20AEE5;}	
	.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box{display: inline-block;vertical-align: top;}
	.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box + .radio_box{margin-left:40px;}
	.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box label{font-size:16px;color:#666;font-weight:400;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd textarea{box-sizing:border-box;resize:none;border:1px solid #ddd;background:#f5f5f5;width:100%;height:160px;outline:none;font-size:16px;color:#333;font-weight:400;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd textarea:focus{border-color:#20AEE5;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd textarea::placeholder{color:#888;}

	.sub_board .table_box .bbs_write.bbs_bottom{border:1px solid #ddd;border-width:1px 0;margin-top:15px;padding-top:15px;padding-bottom:15px;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input.file_name{width:420px;}
	.sub_board .table_box .bbs_write .bbs_tr dl dd .label_btn_file{display: inline-flex;box-sizing:border-box;vertical-align: top;width:100px;height:40px;border-radius:4px;background:#f0f0f0;justify-content:center;align-items:center;font-size:14px;color:#999;font-weight:500;cursor:pointer;}
	.sub_board .table_box .bbs_write .bbs_tr dl dd .board_file_box span{font-size:14px;color:#888;font-weight:400;display: inline-block;margin-left:10px;}
	#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input#captcha{width:236px;}
	.sub_board .table_box .btn_reset{display: inline-flex;box-sizing:border-box;vertical-align: top;width:100px;height:40px;border-radius:4px;background:#fff;border:1px solid #ccc;justify-content:center;align-items:center;font-size:14px;color:#999;font-weight:500;cursor:pointer;}
	.sub_board .table_box .btn_reset:before{width:14px;height:16px;content:"";background:url('../images/sub/icon_reset.png')no-repeat center;display: inline-block;vertical-align: middle;margin-right:5px;}

	#wrap .sub_board .table_box + .policy_cont{box-sizing:border-box;margin-top:40px;}
	#wrap .sub_board .table_box + .policy_cont > div{display:flex;align-items:center;justify-content:space-between;}
	#wrap .sub_board .table_box + .policy_cont > div label{font-size:20px;color:#111;font-weight:400;position: relative;padding-right:31px;padding-left:0;}
	#wrap .sub_board .table_box + .policy_cont > div input[type="checkbox"] + label:before, #wrap .sub_board .table_box + .policy_cont > div input[type="checkbox"] + label::before{position: absolute;right:0;margin:0;top:0px;left:auto;}
	#wrap .sub_board .table_box + .policy_cont > div a{display: inline-block;font-size:14px;color:#666;font-weight:400;border-bottom: 1px solid #666;padding-bottom:2px;}
	#wrap .sub_board .table_box + .policy_cont textarea{margin-top:18px;box-sizing:border-box;width:100%;height:140px;resize:none;background:#f5f5f5;border:1px solid #ccc;border-radius:4px;padding:24px 22px;font-size:13px; color:#666;font-weight:400;line-height:22px;}

	@media only screen and (max-width:1024px){
		.sub_board .table_box .title{padding-bottom:15px;}
		.sub_board .table_box .title h3{font-size:26px;}
		.sub_board .table_box .title h3 span{font-size:14px;}

		.sub_board .table_box .bbs_write .bbs_tr dl{padding:10px 0;}
		.sub_board .table_box .bbs_write .bbs_tr dl + dl{margin-left:40px;}
		.sub_board .table_box .bbs_write .bbs_tr.row2 dl{width:calc(50% - 20px);}
		.sub_board .table_box .bbs_write .bbs_tr dl dt{font-size:16px;width:110px;}
		.sub_board .table_box .bbs_write .bbs_tr dl dt.req:after{width:6px;height:6px;}
		.sub_board .table_box .bbs_write .bbs_tr dl dd{width:calc(100% - 110px);}

		.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box label{font-size:14px;}

		.sub_board .table_box .bbs_write .bbs_tr dl dd .board_file_box span{display: block;margin:5px 0 0 0;}
	}
	@media only screen and (max-width:767px){
		.sub_board .table_box + .table_box{margin-top:50px;}

		.sub_board .table_box .bbs_write .bbs_tr.row2 dl{width:100%;}
		.sub_board .table_box .bbs_write .bbs_tr dl + dl{margin-left:0;}
		.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box + .radio_box{margin-left:20px;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input.file_name{width:45%;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input#captcha{width:30%;}

		.sub_board .table_box + .policy_cont{margin-top:20px;}
		.sub_board .table_box + .policy_cont > div label{font-size:16px;}
	}
	@media only screen and (max-width:640px){
		.sub_board .table_box .title em{font-size:12px;}
		.sub_board .table_box .title em strong{font-size:9px;}

		#wrap .sub_board .table_box .bbs_write .bbs_tr #captcha_box{display: block;margin-bottom:10px;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input#captcha{width:45%;}
		
	}
	@media only screen and (max-width:500px){
		.sub_board .table_box .title h3{font-size:20px;}
		.sub_board .table_box .title h3 span{font-size:13px;}
		.sub_board .table_box .title em{width:100%;margin-top:5px;font-size:12px;}

		.sub_board .table_box .bbs_write .bbs_tr dl{padding:6px 0;}
		.sub_board .table_box .bbs_write .bbs_tr dl dt{font-size:14px;width:92px;}
		.sub_board .table_box .bbs_write .bbs_tr dl dt.req:after{width:4px;height:4px;margin-top:2px;margin-left:2px;}
		.sub_board .table_box .bbs_write .bbs_tr dl dd{width:calc(100% - 92px);padding-left:10px;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input[type="text"], #wrap .sub_board .table_box .bbs_write .bbs_tr dl dd select{height:34px;font-size:13px;padding:0 10px;}
		.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box + .radio_box{margin-left:15px;}
		.sub_board .table_box .bbs_write .bbs_tr dl dd .radio_box label{font-size:13px;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input.file_name{width:100%;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd .label_btn_file{width:100%;height:34px;margin-top:5px;font-size:13px;}
		#wrap .sub_board .table_box .bbs_write .bbs_tr dl dd input#captcha{width:100%;}
		.sub_board .table_box .btn_reset{width:100%;height:34px;margin-top:5px;font-size:13px;}

		#wrap .sub_board .table_box + .policy_cont > div label{font-size:14px;padding-right:26px;}
		#wrap .sub_board .table_box + .policy_cont > div a{line-height:initial;padding-bottom:0;font-size:12px;}
		#wrap .sub_board .table_box + .policy_cont textarea{margin-top:15px;height:120px;padding:10px 10px;font-size:13px;line-height:20px;}
	}


/*───────────────────────────────────────────────────────────

	board list

───────────────────────────────────────────────────────────*/
    #wrap .search_wrap{border:1px solid var(--border-color01); background: var(--gray-bg); border-radius: 10px; padding:32px; box-sizing: border-box; font-size: var(--title-20); margin-bottom: 50px;}
    #wrap .search_wrap fieldset{display: flex;flex-wrap: wrap;gap: 10px;justify-content: center;}
    #wrap .search_wrap .board_search_sel{display: flex;gap: 10px;width: 320px;}
    #wrap .search_wrap :where(select, input[type="text"]){font-size: 90%;font-weight: 400;color: var(--black-color06);border:1px solid var(--border-color01);padding-left: 20px; border-radius: 6px;}
    #wrap .search_wrap select{width: 100%; height: 100%; appearance: none; background: var(--point-white) url('../images/sub/select_arw.svg') no-repeat calc(100% - 20px) 50%; padding-right: 45px;}
    #wrap .search_wrap input[type="text"]{height: 56px;width: 379px;padding-right: 80px;}
    #wrap .search_wrap .inp_box{position: relative; display: flex;}
    #wrap .search_wrap .btn_search{position: absolute; top:0; right:0; width: 56px; height: 100%; border-radius: 6px; border:0; font-size: 0; background: var(--point-color04) url('../images/sub/btn_search.svg') no-repeat 50% 40%;}

    #wrap .gallery_list{display: flex;flex-wrap: wrap;gap: 47px 30px;}
	#wrap .gallery_list + .gallery_list{margin-top:50px;}
    #wrap .gallery_list > li{position: relative; width: calc(100% / 3 - 20px);}
    #wrap .gallery_list > li > a{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
    #wrap .gallery_list .thumb{position: relative;font-size: 0;padding-bottom: 63.1%;overflow: hidden;border-radius: 10px;}
    #wrap .gallery_list .thumb img{position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: cover;}
    #wrap .gallery_list .desc{font-size: var(--title-20);margin-top: 20px;}
    #wrap .gallery_list .desc dt{font-size: inherit;font-weight: 500;color: var(--black-color00);letter-spacing: -0.03em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
	#wrap .gallery_list .desc dt em.notice{color:var(--point-color01);display: block;}
    #wrap .gallery_list .desc dt + dd{margin-top: 18px;}
    #wrap .gallery_list .desc dd{font-size: 85%; font-weight: 400; color: var(--black-color09); }

    #wrap .paging {padding:60px 0 0; line-height:normal; font-size:0;margin:0;box-sizing:border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; text-align: center; font-size: var(--title-20); gap: 10px;}
		#wrap .paging span {display:inline-block;}
		#wrap .paging a {display:inline-flex; align-items: center; justify-content: center; font-size:75%; color:var(--black-color06); padding:0 5px;border:0;box-sizing:border-box; width: 36px; height:36px; line-height:1.2; min-width:auto; border-radius: 100%;}
		#wrap .paging :is(.on a, a.on){background: var(--point-color01); color: var(--point-white); font-weight: 500;}
		#wrap .paging .arrow a {font-size:0; background: url("../images/sub/paging_first.svg") no-repeat center;}
		#wrap .paging :is(.arrow.prev a, .arrow.next a) {background-image:url("../images/sub/paging_prev.svg") }
		#wrap .paging :is(.arrow.next a, .arrow.last a){transform: scale(-1,-1);}
		#wrap .view_btn {text-align:center;line-height:normal;position:relative;min-height:auto;}


        @media screen and (max-width:1200px){
            #wrap .gallery_list{gap: 47px 20px;}
            #wrap .gallery_list > li{width: calc(100% / 3 - 13.34px);}
        }
        @media screen and (max-width:1023px){
            #wrap .gallery_list{gap: 47px 15px;}
            #wrap .gallery_list > li{width: calc(100% / 3 - 10px);}
        }
        @media screen and (max-width:860px){
            #wrap .search_wrap{padding:30px; margin-bottom: 40px;}
            #wrap .search_wrap .board_search_sel{width: 100%;}
            #wrap .search_wrap :where(select, input[type="text"]){padding-left: 15px;}
            #wrap .search_wrap select{background-position: calc(100% - 15px) 50%;padding-right: 40px;height: 50px;}
			#wrap .search_wrap .inp_box{width:100%;}
            #wrap .search_wrap input[type="text"]{height: 50px; padding-right: 65px; width:100%;}
            #wrap .search_wrap .btn_search{width: 50px; background-size: 24px auto;}

            #wrap .gallery_list .desc{margin-top: 17px;}
            #wrap .gallery_list .desc dt + dd{margin-top: 13px;}

            #wrap .paging a{width: 32px; height: 32px;}
        }
        @media screen and (max-width:640px){
            #wrap .search_wrap{padding:25px; border-radius: 5px; margin-bottom: 30px;}
            #wrap .search_wrap :where(select, input[type="text"]){border-radius: 3px;}
			#wrap .search_wrap select{height:45px;}
            #wrap .search_wrap input[type="text"]{height: 45px;}
            #wrap .search_wrap .btn_search{width: 45px; background-size: 22px auto; border-radius: 3px;}

            #wrap .gallery_list > li{width: calc(100% / 2 - 7.5px);}
            #wrap .gallery_list .thumb{border-radius: 5px;}

            #wrap .paging{gap: 5px; padding-top: 50px;}
            #wrap .paging a{width: 30px; height: 30px;}
        }
        @media screen and (max-width:479px){
            #wrap .search_wrap{margin-bottom: 20px;}

            #wrap .gallery_list{gap: 40px 15px;}
			#wrap .gallery_list + .gallery_list{margin-top:40px;}
            #wrap .gallery_list .desc{margin-top: 12px;}
            #wrap .gallery_list .desc dt{font-size: 90%;}
                #wrap .gallery_list .desc dt + dd{margin-top: 8px;}
            #wrap .gallery_list .desc dd{font-size: 80%;}

            #wrap .paging{padding-top: 40px;}
        }
        @media screen and (max-width:360px){
            #wrap .search_wrap .board_search_sel{width: 100%;}

            #wrap .gallery_list > li{width: 100%;}
        }

/*───────────────────────────────────────────────────────────

	board view

───────────────────────────────────────────────────────────*/
    #wrap .bbs_view{font-size: var(--title-20);}
    #wrap .bbs_view .view_tit{position: relative;padding: 25px 140px 23px 20px;font-size:var(--title-20);background: var(--point-white);box-sizing: border-box;border-top: 2px solid var(--black-color01);border-bottom: 1px solid var(--border-color01);}
    #wrap .bbs_view .view_tit h3{font-size: 120%;font-weight: 500;color: var(--black-color01);line-height: 1.4;letter-spacing: -0.03em;}
    #wrap .bbs_view .view_tit p{position: absolute;top:50%;right:20px;transform: translateY(-50%);font-size: 85%;width: auto;color: var(--black-color09); margin:0; padding:0;}
    #wrap .bbs_view .view_cont{padding:40px 0 60px; font-size: inherit; font-weight: 300; color: var(--black-color00); line-height: 1.5; border-bottom: 1px solid var(--border-color01);}

    @media screen and (max-width:860px){
        #wrap .bbs_view .view_tit{padding: 20px 120px 20px 15px;}
        #wrap .bbs_view .view_tit p{right: 15px;}
        #wrap .bbs_view .view_cont{padding:35px 0 55px;}
    }
    @media screen and (max-width:640px){
        #wrap .bbs_view .view_tit{padding: 20px 15px;}
        #wrap .bbs_view .view_tit p{position: relative; top:auto; right: auto; margin-top: 10px; transform: none;}
        #wrap .bbs_view .view_cont{padding:30px 0 50px;}
    }
    @media screen and (max-width:479px){
        #wrap .bbs_view .view_tit h3{font-size: 110%;}
        #wrap .bbs_view .view_tit p{font-size: 80%;}
        #wrap .bbs_view .view_cont{padding:25px 0 40px; font-size: 90%; font-weight: 400;}
    }


/*───────────────────────────────────────────────────────────

	논문 특허

───────────────────────────────────────────────────────────*/
    .sub_thesis{padding-top: 1.5vw;}
    .sub_thesis .info_list{display: flex;flex-wrap: wrap;gap: 40px;counter-reset: item;}
    .sub_thesis .info_list > li{position: relative; border: 1px solid var(--border-color01); width: calc(100% / 2 - 20px); box-sizing: border-box; padding:40px 38px; border-radius: 20px;}
        .sub_thesis .info_list > li.bk{width: 100%;}
    .sub_thesis .info_list .desc{font-size: var(--title-20);}
    .sub_thesis .info_list .desc dt{font-size: inherit; font-weight: 600; color: var(--black-color03); line-height: 1.4; display: flex; align-items: center; gap: 30px;}
        .sub_thesis .info_list .desc dt:before{display: inline-flex; align-items: center; justify-content: center; content: counter(item); counter-increment: item; width: 40px; height: 40px; border-radius: 100%; background: var(--point-color04); font-size: 80%; font-weight: 600; color: var(--point-white); flex-shrink:0;}
        .sub_thesis .info_list .desc dt + dd{margin-top: 25px;}
    .sub_thesis .info_list .desc dd{font-size: 0;}

    @media screen and (max-width:1200px){
        .sub_thesis .info_list{gap: 30px;}
        .sub_thesis .info_list > li{width: calc(100% / 2 - 15px);}
    }
    @media screen and (max-width:1023px){
        .sub_thesis .info_list{gap: 15px;}
        .sub_thesis .info_list > li{width: calc(100% / 2 - 10px);}
    }
    @media screen and (max-width:860px){
        .sub_thesis .info_list > li{padding:35px 33px;}
        .sub_thesis .info_list .desc dt{gap: 25px;}
            .sub_thesis .info_list .desc dt:before{width: 35px; height: 35px;}
        .sub_thesis .info_list .desc dt + dd{margin-top: 20px;}
    }
    @media screen and (max-width:640px){
        .sub_thesis .info_list > li{padding:30px 28px; border-radius: 10px; width: 100%;}
        .sub_thesis .info_list .desc dt{gap: 20px;}
            .sub_thesis .info_list .desc dt:before{width: 32px; height: 32px;}
        .sub_thesis .info_list .desc dt + dd{margin-top: 15px;}
    }
    @media screen and (max-width:479px){
        .sub_thesis .info_list > li{padding:25px 23px; }
        .sub_thesis .info_list .desc dt{gap: 15px;}
            .sub_thesis .info_list .desc dt:before{width: 30px; height: 30px;}
    }


/*───────────────────────────────────────────────────────────

	연혁

───────────────────────────────────────────────────────────*/
    .sub_history {padding-top:0%;box-sizing:border-box;}
    .sub_history div, 
    .sub_history p, 
    .sub_history span, 
    .sub_history em, 
    .sub_history strong, 
    .sub_history dt, 
    .sub_history dd, 
    .sub_history dl, 
    .sub_history li, 
    .sub_history ul {transition:all 0.2s;}
    .sub_history div, 
    .sub_history p, 
    .sub_history li, 
    .sub_history dt, 
    .sub_history dd, 
    .sub_history th, 
    .sub_history td {word-break:keep-all;word-wrap:break-word;}

    .sub_history .history_box .his_year .year strong {}

    .sub_history .history_wrap {position:relative;width:100%;z-index:1;box-sizing:border-box;margin-top:2%;}
    .sub_history .history_wrap:before {content:"";display:none;width:1px;height:100%;position:absolute;left:50%;top:0;background:#ddd;}
        /* 내용 */
    .sub_history .history_box {display:block;position:relative;width:100%;z-index:1;box-sizing:border-box;font-size: 0;}
    .sub_history .history_box:after {clear:both;content:"";display:block;}
    .sub_history .history_box + .history_box {}
    .sub_history .history_box .his_year,
    .sub_history .history_box .his_detail {width:50%;display:block;box-sizing:border-box;vertical-align:top;}
    .sub_history .history_box + .history_box .his_year,
    .sub_history .history_box + .history_box .his_detail {}
        /* 연도 */
    .sub_history .history_box .his_year {}
    .sub_history .history_box .his_year .year {position:relative;z-index: 99;box-sizing:border-box;}
    .sub_history .history_box .his_year .year strong {margin:0;position: relative;font-size: 30px;line-height: 0.9;color: #1e88e5;z-index: 5;}
    .sub_history .history_box .his_year .year::before,
    .sub_history .history_box .his_year .year strong::after {top:50%;content:"";position:absolute;z-index:10;width: 45px;height: 1px;background: #1e88e5;z-index: -1;}
        /* 원 */
    .sub_history .history_box .his_year .year::before {width:10px;height:10px;border-radius:100%;;box-shadow:0 0 0 4px rgba(255, 255, 255, 1);}
    .sub_history .history_box .his_year .year::before,
    .sub_history .history_box .his_year .year::after {content:'';display:inline-block;}
    .sub_history .history_box .his_year .year::before {width: 20px;height: 22px;border: 3px solid #1e88e5;box-sizing: border-box;opacity: .2;z-index: 1;}
    .sub_history .history_box .his_year .year::after {background: #1e88e5;width: 30px;height: 30px;opacity: 0.1;position:absolute;top: -1px;border-radius: 100%;} 
    .sub_history .history_box .his_year .year strong:before {content:'';display:block;position: absolute;z-index: 10;border-radius: 100%;background-color: #fff;width: 14px;height: 14px;border: 3px solid #1e88e5;box-sizing: border-box;}

        /* 세부내역 */
    .sub_history .history_box .his_detail {box-sizing:border-box;position:relative;padding-bottom: 88px;}
    .sub_history .history_box .his_detail:before {content:'';display:block;width:1px;height:100%;background:#ddd;top: 10px;position:absolute;}
    .sub_history .history_box .his_detail .detailYear {width:auto;position:relative;box-sizing:border-box;}
    .sub_history .history_box .his_detail .detailYear:after {clear:both;content:"";display:block;}
    .sub_history .history_box .his_detail .detailYear + .detailYear {padding-top:2%;}
    .sub_history .history_box .his_detail .detailYear dt,
    .sub_history .history_box .his_detail .detailYear dd {display:inline-block;box-sizing:border-box;}
    .sub_history .history_box .his_detail .detailYear dt {width:8%;line-height: 1.35;font-size: 20px;font-weight: 500;color: #333;}
    .sub_history .history_box .his_detail .detailYear dd {width: 100%;color:#666;}
    .sub_history .history_box .his_detail .detailYear dd ul {}
    .sub_history .history_box .his_detail .detailYear dd li {padding:0;line-height: 1.6875;font-size:16px;vertical-align:middle;box-sizing:border-box;}
    .sub_history .history_box .his_detail .detailYear dd li strong{font-weight: 500; color: #333;}
    .sub_history .history_box .his_detail .detailYear dd li::before {line-height:inherit;font-size:inherit;vertical-align:middle;}
    .sub_history .history_box .his_detail .detailYear dd li + li {margin-top: 0.81em;}
    .sub_history .history_box:last-of-type .his_detail:before {display:none;}

        /* 홀수일때-좌측정렬 */
    .sub_history .history_box:nth-of-type(even) {}
    .sub_history .history_box:nth-of-type(even) .his_year {float:right;text-align:left;}
    .sub_history .history_box:nth-of-type(even) .his_detail {float:left;text-align:right;}
    .sub_history .history_box:nth-of-type(even) .his_year,
    .sub_history .history_box:nth-of-type(even) .his_detail {}
    .sub_history .history_box:nth-of-type(even) .his_detail:before {right: -1px;}
    .sub_history .history_box:nth-of-type(even) .his_year .year {/* padding-left:11.5%; */}
    .sub_history .history_box:nth-of-type(even) .his_year .year::before {left: -10px;top: 3px;}
    .sub_history .history_box:nth-of-type(even) .his_year .year::after {left: -15px;}
    .sub_history .history_box:nth-of-type(even) .his_year .year strong {padding-left: 11.5%;}
    .sub_history .history_box:nth-of-type(even) .his_year .year strong:before {left: -7px;top: 12px;}
    .sub_history .history_box:nth-of-type(even) .his_year .year strong::after {left: 4px;}
    .sub_history .history_box:nth-of-type(even) .his_detail .detailYear {margin-right: 11.5%;text-align:right;}
    .sub_history .history_box:nth-of-type(even) .his_detail .detailYear dt {float:right;}
    .sub_history .history_box:nth-of-type(even) .his_detail .detailYear dd {float:left;}
        /* 짝수일때-우측정렬 */
    .sub_history .history_box:nth-of-type(odd) {}
    .sub_history .history_box:nth-of-type(odd) .his_year {float:left;text-align:right;}
    .sub_history .history_box:nth-of-type(odd) .his_detail {float:right;text-align:left;}
    .sub_history .history_box:nth-of-type(odd) .his_year,
    .sub_history .history_box:nth-of-type(odd) .his_detail {}
    .sub_history .history_box:nth-of-type(odd) .his_detail:before {left:0;}
    .sub_history .history_box:nth-of-type(odd) .his_year .year {}
    .sub_history .history_box:nth-of-type(odd) .his_year .year::after {right: -15px;top: -3px;}
    .sub_history .history_box:nth-of-type(odd) .his_year .year::before {right: -10px;top: 1px;}
    .sub_history .history_box:nth-of-type(odd) .his_year .year strong {padding-right: 11.5%;}
    .sub_history .history_box:nth-of-type(odd) .his_year .year strong:before {right: -7px;top: 10px;}
    .sub_history .history_box:nth-of-type(odd) .his_year .year strong::after {right: 4px;margin-top: -2px;}
    .sub_history .history_box:nth-of-type(odd) .his_detail .detailYear {margin-left: 11.5%;text-align:left;}
    .sub_history .history_box:nth-of-type(odd) .his_detail .detailYear dt {float:left;}
    .sub_history .history_box:nth-of-type(odd) .his_detail .detailYear dd {float:right;}

    @media only screen and (max-width:1200px) {

    }
    @media only screen and (max-width:1023px) {

    }
    @media only screen and (max-width: 860px) {
        .sub_history .history_box .his_year .year strong::after {width:30px;}
        .sub_history .history_box .his_year .year strong {font-size:25px;}
        .sub_history .history_box .his_detail {padding-bottom:80px;}
        .sub_history .history_box .his_detail .detailYear + .detailYear {padding-top:5%;}
        .sub_history .history_box .his_detail .detailYear dt {font-size:18px;width: 30px;}
        .sub_history .history_box .his_detail .detailYear dd {width: calc(100% - 30px);}
        .sub_history .history_box .his_detail .detailYear dd li {font-size:14px;}

        .sub_history .history_box:nth-of-type(odd) .his_year .year strong:before {top: 9px;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year::after {top: -3px;}
        .sub_history .history_box:nth-of-type(even) .his_year .year strong:before {top: 9px;}
        .sub_history .history_box:nth-of-type(even) .his_year .year::after {top: -3px;}

    }
    @media only screen and (max-width:767px) {

    }
    @media only screen and (max-width: 640px) {
        .sub_history .history_box .his_year .year strong {font-size:20px;line-height: 1;}
        .sub_history .history_box .his_year .year strong:before {width:10px;height:10px;border: 2px solid #1e88e5;}
        .sub_history .history_box:nth-of-type(odd) .his_year,
        .sub_history .history_box:nth-of-type(even) .his_year {float:inherit;display: inline-block;vertical-align: top;width: 120px;padding-left: 0;text-align: left;}
        .sub_history .history_box:nth-of-type(odd) .his_detail,
        .sub_history .history_box:nth-of-type(even) .his_detail {float:inherit;display: inline-block;vertical-align: top;width: calc(100% - 120px);padding-left: 20px;text-align: left;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year strong,
        .sub_history .history_box:nth-of-type(even) .his_year .year strong {padding-left: 44px;padding-right:0;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year strong:before,
        .sub_history .history_box:nth-of-type(even) .his_year .year strong:before {top: 4px;left: 4px;right: inherit;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year strong::after,
        .sub_history .history_box:nth-of-type(even) .his_year .year strong::after{margin-top:-3px;}
        .sub_history .history_box:nth-of-type(odd) .his_detail:before,
        .sub_history .history_box:nth-of-type(even) .his_detail:before {left: -112px;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year::before,
        .sub_history .history_box:nth-of-type(even) .his_year .year::before {left: 1px;width: 15px;height: 15px;border: 3px solid #1e88e5;right: inherit;top: 0px;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year::after, 
        .sub_history .history_box:nth-of-type(even) .his_year .year::after {width: 21px;height: 21px;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year strong::after,
        .sub_history .history_box:nth-of-type(even) .his_year .year strong::after {left: 13px;right: inherit;width: 20px;}
        .sub_history .history_box:nth-of-type(odd) .his_detail .detailYear,
        .sub_history .history_box:nth-of-type(even) .his_detail .detailYear {text-align:left;margin-left: 0;}
        .sub_history .history_box:nth-of-type(odd) .his_year .year::after,
        .sub_history .history_box:nth-of-type(even) .his_year .year::after {right:inherit;left: -2px;top: -3px;}
        .sub_history .history_box .his_year {width:23%}
        .sub_history .history_box .his_detail {padding-bottom:50px;width:calc(100% - 23%)}
        .sub_history .history_box .his_detail:before {top: 10px;}
        .sub_history .history_box .his_detail .detailYear {width:93.6%;}
        .sub_history .history_box .his_detail .detailYear + .detailYear {padding-top:2%;}
        .sub_history .history_box .his_detail .detailYear dt {width:28px;line-height:1.32;font-size:15px;}
        .sub_history .history_box .his_detail .detailYear dd {width:calc(100% - 28px);}
        .sub_history .history_box .his_detail .detailYear dd ul {}
        .sub_history .history_box .his_detail .detailYear dd li {line-height:1.42;font-size:15px;}
        .sub_history .history_box .his_detail .detailYear dd li + li {margin-top:3.8em;}
        .sub_history .history_box:nth-of-type(even) .his_detail .detailYear dt {float:left;}
        .sub_history .history_box:nth-of-type(even) .his_detail .detailYear dd {float:right;}

    }

    @media only screen and (max-width: 479px) {
        .sub_history .history_box:nth-of-type(odd) .his_year,
        .sub_history .history_box:nth-of-type(even) .his_year {width: 105px;}
        .sub_history .history_box .his_year .year strong {font-size:18px;}
        .sub_history .history_box .his_detail .detailYear dt {font-size:13px;}
        .sub_history .history_box .his_detail .detailYear dd li {font-size:13px;}
        .sub_history .history_box:nth-of-type(odd) .his_detail,
        .sub_history .history_box:nth-of-type(even) .his_detail {width: calc(100% - 105px);}
        .sub_history .history_box:nth-of-type(odd) .his_detail:before, 
        .sub_history .history_box:nth-of-type(even) .his_detail:before {left: -96px;}
        .sub_history .history_box .his_detail {padding-bottom:39px;}

    }