@media (max-width:1780px){
	#header{padding: 0 30px}
}
@media (max-width:1700px){
	#header .left{padding:60px 30px 100px 30px; width: 350px}
}
@media (max-width:1600px){
	/* #lnb > li{padding: 30px 0} */
}
@media (max-width:1400px){
	#topNav{flex:1; margin: 0 30px;}
	/* #lnb{justify-content: space-between;}
	#lnb > li > a{padding: 0 10px} */
	
	#header .t{font-size: 30px;}
	#header .left{width: 180px; padding: 40px 18px}
	#header .txt{display: none;}
	#header .right{padding: 40px 30px 100px}
	
	.vil-state_w{margin: 0 0 -20px -20px;}
	.vil-state_w > li{width: calc(25% - 20px); margin: 0 0 20px 20px;}
	.vil-state_w .dev > li:not(:first-child){padding-left: 10px;}
}
@media (max-width:1300px){
	.inner{padding-left: 1rem; padding-right: 1rem;}
	#header{padding: 0 1rem}
	#header .btns-etc > *:not(:first-child){margin-left: 15px;}
	/* #lnb > li > a{font-size: 18px;} */
	
	#location .inner{padding-left: 0; padding-right: 0;}
	
	#lnb > li > a{padding: 40px 15px}
}
@media (max-width:1080px){
	#topNav{margin: 0 10px;}
}
@media (max-width:1024px){
	#topNav{display: none;}
	#header{padding: 10px 1rem; height: auto}
	#logo{margin-top: 0;}
	
	#subVisual{padding-top: 89px; height: 350px}
	
	.block-pc{display: none !important}
	.block-t{display: block !important}
	.go-top,#header .btns-etc .member{display: none;}
	
	#footer{padding: 30px 0;}
	#footer .inner{flex-flow:column; text-align: center;}
	#footer .mid{margin: 30px 0;}
	#footer .link,#footer .bot{justify-content:center}
	#footer .bot{margin-top: 30px;}
	
	#subTop{padding-top: 75px;}
	.sub-page{padding-bottom: 100px;}
	.sub-member{padding-top:60px; padding-bottom: 80px;}
	.bbs-list th{padding: 10px 5px; height: 50px}
	.bbs-list td{padding: 15px 10px; height: auto}
	#subTop{flex-flow: column;  align-items: center;}
	.sub-etc{flex-flow: column;}
	.sub-share .btn-print{display: none;}

	.sub-loc{margin: 18px 0 0;}
	.sub-etc{gap:20px}
	.cont-ml{margin-left: 0;}
	
	.box-st1,.box-st3{padding: 1.5rem}
	.page-contact .box{padding: 1.5rem; gap:25px}
	
	.dev-intro{margin: 0 0 -20px -20px;}
	.dev-intro > li{width: calc(50% - 20px); margin: 0 0 20px 20px;     padding: 30px 30px 150px;}
	
	.bbs-sch{padding: 1.5rem}
	
	.bbs-sch .item.half{width: 100%}
	.bbs-keyword .btns{width: 150px}
	/* .bbs-sch .item .t{width: 100px} */
	.bbs-sch .item{flex-flow:column;     align-items: flex-start; gap:10px}
	.bbs-sch .item .t,.bbs-sch .item .c{width: 100%}
	input[type=radio] + label:before, input[type=checkbox] + label:before{width: 15px; height: 15px; margin-right: 10px; background-size:10px}
	
	.bbs-sch select,.bbs-sch select.max-2,.bbs-sch select.max-3{width: 100%}
	.bbs-keyword .btns{width: 100%}
	.bbs-keyword select{width: 126px}
	.bbs-keyword input[type="text"]{width: calc(100% - 126px)}
	
	.bbs-info .item .t{width: 115px;}
	.bbs-info .item .c, .bbs-info .item .tbl{width: calc(100% - 115px)}
	.bbs-info .item .t, .bbs-info .item2 .t2,.bbs-info .item .c{padding: 10px 15px}
	.bbs-info .item.half{width: 100%}
	.bbs-info .item .c, .bbs-info .item2 .c2{min-height: 55px}
	
	.bbs-info .item2 .t2{width: 115px;}
	.bbs-info .item2 .c2{width: calc(100% - 115px)}
	
	.box-st2 .t{padding: 15px 10px}
	.box-st2 .cont{padding: 30px 0}
	.box-st2 .cc{font-size: 1.3rem;}
	
	.vil-state_w{margin: 0 0 -15px -15px;}
	.vil-state_w > li{width: calc(50% - 15px); margin: 0 0 15px 15px;}
	
	.vil-state_w .dev{text-align: center;}
	.vil-state_w .dev > li{padding: 0; width: 33.333%}
	
	.bbs-top{    flex-flow: column-reverse;  align-items: baseline; gap:15px; margin-bottom: 15px;}
	.bbs-sch2{width: 100%;}
	.bbs-list,.bbs-list th, .bbs-list td{border-radius:0 !important}
	
	.bbs-file .ttt{padding-right: 30px;}
	
	.bbs-gallery{margin: 0 0 -20px -20px;}
	.bbs-gallery > li{width: calc(25% - 20px); margin: 0 0 20px 20px; }
	.bbs-gallery .cont{padding: 20px 15px}
	
	#header .btn-menu.pc{display: none;}
	#header .btn-menu.tablet{display: flex}
	
	.box-ck{padding: 1.5rem}
	.box-ck:before{margin-right: 1.5rem;}
	
	.box-check{padding: 30px}
	.box-check .t{font-size: 30px; background-position-y: 5px;}
	.box-check .t:before{width:35px; background-size:100%; height: 35px}
	.box-check .t.doc:before{width:30px; height: 35px}
	
	.bbs-info .last-1024{border-bottom: 0;}
	
	.bbs-info .item.w33{width: 100%}
	
	.form-dev3,
	.form-dev3 > *{margin-left: 0;}
	.steps-st1{margin-left: -30px;}
	.steps-st1 > li{margin-left: 30px;; width: calc(20% - 30px);     flex-flow: column; height: 67px}
	.steps-st1 > li:not(:first-child):before{left: -30px; width: 30px; background-size: 7px;}
	
	.box-req .img{right: 0; width: 275px}
	.box-req{padding-right: 300px; padding-left: 40px;}
	
	.steps-type > li:not(:first-child):before{margin: 0 10px;}
	
	.stats-graph > li{padding: 18px; width: calc(50% - 10px)}
	.stats-graph .ab strong{font-size: 1.8em;}
	
	.steps-app{margin-left: -40px;}
	.steps-app > li{width: calc(25% - 40px); margin-left: 40px;}
	.steps-app > li:not(:first-child):before{width: 40px; left: -40px}
	
	.graph-invil .top strong{font-size: 120px;}
	.graph-invil .top strong:before, .graph-invil .top strong:after{font-size: 100px;}
	.graph-invil .mid li{    width: 33vw;
    height: 33vw;}
	.graph-invil .dev > li{padding: 0 30px 30px}
    
    .api_w{flex-flow: column; gap: 30px;}
	.api_w > *{width: 100%}
	
	.ov-x{overflow-x: auto;}
}
@media (max-width:841px){
	.bbs-gallery{margin-left: -15px;}
	.bbs-gallery > li{width: calc(50% - 15px); margin-left: 15px;}
	
	
	.steps-app{margin: 0 0 -20px -20px}
	/* .steps-app,.steps-app > li{flex-flow:column} */
	.steps-app > li{width: calc(50% - 20px); margin: 0 0 20px 20px;}
	.steps-app > li:not(:first-child):before,.steps-app2 > li:not(:first-child):before{    width: 20px;
    left: -20px;
    background-size: 15px;}
	.steps-app > li:nth-child(3):before{    background-size: 15px;
    left: 100% !important;
    top: -16px;
    height: 13px;
    transform: rotate(135deg);}
    
    .steps-app2, .steps-app2_bot{margin-left: -20px;}
    .steps-app2 > li, .steps-app2_bot:before,.steps-app2_bot > li{margin-left: 20px;}
    
    .steps-app2 > li:nth-child(2),
    .steps-app2_bot > li{width: calc(50% - 20px)}
    .steps-app2 > li{width: calc(25% - 20px)}
    .steps-app2_bot:before{height: 23px; background-size:13px; margin-top: 15px; margin-bottom: 15px;}
    
    .tbl-blue .ta-l{padding-left: 1rem;}
	
}
@media (max-width:720px){
	.block-m{display: block !important}
	#logo a{width: 130px; height: 61px; background-size:100%}
	#subVisual{padding-top: 82px; height: 300px}
	#footer .link span:not(:last-child){padding-right: 13px; margin-right: 10px;}
	.modal-st1 .modal-cont{padding: 30px 15px}
	
	.paging_w li, .paginationSet li{font-size: 16px; margin: 0 5px;}
	.paging_w .arrow, .paginationSet .i{width: 13px; height: 13px; background-size:100%}
	.paging_w .prev, .paginationSet .prev{margin: 0 15px 0 6px;}
	.paging_w .next, .paginationSet .next{margin: 0 6px 0 15px;}
	
	#location{font-size: 1.125rem;}
	#location a{height: 60px}
	#sub-t{font-size: 45px;}
	
	.sub-loc span:not(:first-child):before{margin: 0 15px 0 13px;}
	.dev-intro > li{width: calc(100% - 20px)}
	
	
	.bbs-info .item .t{width: 100px;}
	.bbs-info .item .c, .bbs-info .item .tbl{width: calc(100% - 100px)}
	.bbs-info .item .t, .bbs-info .item2 .t2,.bbs-info .item .c{padding: 10px}
	
	.bbs-info .item2 .t2{width: 85px; padding: 10px 5px 10px 10px}
	.bbs-info .item2 .c2{width: calc(100% - 85px)}
	
	.vil-state_w > li{padding: 1.5rem}
	.vil-state_w > li:before{width: 75px; height: 75px; background-size:67%; right: 1.5rem; top:1.5rem}
	/* .vil-state_w .dev{flex-wrap:wrap}
	.vil-state_w .dev > li{width: 50%}
	.vil-state_w .dev > li:first-child{width: 100%; border-bottom: 1px solid #ddd;; padding-bottom: 15px; margin-bottom: 15px;}
	.vil-state_w .dev > li:nth-child(2){border-left: 0;} */
	.vil-state_w .no{margin-top: 55px;}
	
	.vil-state_w .no .big{font-size: 38px;}
	
	.bbs-sch2{gap:5px}
	.bbs-sch2 .btn-sch{width: 25%; max-width: 80px;}
	.bbs-sch2 select{width: 30%}
	
	.bbs-view_top{padding: 0 0 25px; margin-top: -15px;}
	
	.bbs-file{padding: 1.5rem; flex-flow:column; gap:10px}
	.bbs-file .ttt{margin-top: 0;}
	.bbs-file .items{width: 100%}
	.bbs-file .items a{background-position-x:10px; padding: 7px 35px;}
	.bbs-file .items a:after{width: 30px; background-size:50%}
	.bbs-file .ttt:after{display: none;}
	.bbs-view_c{padding: 30px 0}
	.bbs-view_top .etc{margin-left: -15px;}
	.bbs-view_top .etc > *{margin-left: 15px;}
	.prev_next .t{padding-left: 0; width: 6.15em; margin-right: 18px;}
	
	.bbs-view_gallery{display: block;}
	.bbs-view_gallery .s_w{width: 100%; margin-bottom: 18px;}
	.bbs-view_gallery .cont-right{width: 100%}
	
	#topNav_m{padding: 18px 15px}
	.steps-member{gap:30px}
	.steps-member .no{width: 60px; height: 60px}
	.steps-member > li:not(:first-child):before{left: -30px; width: 30px; top:29px}
	
	.agree-ck{padding: 15px}
	.agree-box{padding: 15px; height: 180px}
	
	.tit-page{font-size: 35px;}
	.box-ck{flex-flow: column; gap:10px; text-align: center;}
	.box-ck:before{width: 40px; height: 40px; margin-right: 0 !important}
	.box-ck br{display: none;}
	
	.write-st1 .group{display: block;}
	.write-st1 .t{padding: 0; margin-bottom: 10px; display: block; width: 100%}
	.write-st1 .c{padding: 0; width: 100%}
	.write-st1 .group:not(:first-child){margin-top: 30px;}
	
	.form-btn_w button{font-size: 13px;}
	
	.join-ok .top:before{width: 130px;  height: 130px; background-size: 55%; margin-bottom: 30px;}
	
	.tbl-st1 th,.tbl-st1 td{padding: 5px}
	.tbl-st1 th,.tbl-st1 td{height: 50px}
	.box-member{padding: 30px}
	.btn_w-cer button{width: 80px}
	
	.box-check .t{padding: 0 0 0; text-align: center; display: block;}
	.box-check .t:before{margin: 0 auto 10px !important;}
	
	.steps-st1{margin: 0 0 30px -15px;}
	.steps-st1 > li{margin: 0 0 15px 15px; width: calc(33.333% - 15px)}
	.steps-st1 > li:not(:first-child):before{width: 15px; left: -15px;}
	.steps-st1 > li:nth-child(4):before{display: none;}
	
	.btn_w-st1{flex-flow:column}
	.btn-st2{width: 100%}
	
	.bbs-info_top .big{font-size: 35px;}
	.file-st1 label{width: 67px; letter-spacing: -0.04em;}
	
	.d-datetime{flex-flow:column;gap:5px;     justify-content: start; padding: 0 10px}
	.d-datetime > *{width: 100%; justify-content: start}
	.d-datetime > *:last-child:after{display: none;}
	.bbs-faq td{padding: 15px 10px}
	
	.bbs-faq a:after,{right: 5px; width: 8px; height: 8px}
	.bbs-faq2 a{padding: 1.25rem 1.5rem}
	.bbs-faq2 .q div{margin: 0 1.5rem;}
	.bbs-faq2 a:after{width: 10px; height: 10px}
	.bbs-faq2 .a{padding: 20px 15px 20px 2rem;}

	.box-req{min-height: atuo}
	.box-req br{display: none;}
	.box-req .img{right: 0; width: 185px}
	.box-req{padding:30px 30px 100px 30px}
	
	.tbl-blue{font-size: 1rem;}
	.tbl-blue th{padding: 10px 5px; font-size: 1.125rem;}
	.tbl-blue td{padding: 15px 5px}
	
	.steps-type,.steps-type > li{flex-flow:column}
	.steps-type > li:not(:first-child):before{transform: rotate(90deg);  margin: 15px 0;}
	
	#location .inner{white-space: nowrap; overflow-x: auto;}
	#location li{width: auto !important}
	#location a{padding: 10px 1em}
	
	.stats-graph{flex-flow: column; gap: 15px;}
	.stats-graph > li{width: 100%}
	
	.tabs-st1{font-size: 1.125rem}
	.tabs-st1 a{height: 55px}
	
	.graph-invil .mid{font-size: 5vw;}
	.graph-invil .top strong{font-size: 18vw;}
	.graph-invil .top strong{padding: 0 10vw}
	.graph-invil .top strong:before, .graph-invil .top strong:after{font-size: 16vw;}
	.graph-invil .top{background-size:70%; padding-bottom: 30vw;}
	
	.graph-invil .mid{margin-bottom: 0;}
	.graph-invil .mid:after{display: none;}
	
	.graph-invil .dev{flex-flow:column; gap:80px}
	.graph-invil .dev > li{width: 100%; background: #fff}
	/* .graph-invil .dev > li:before{width: 30px; left: -30px; top:15px; height: 1px;} */
	.graph-invil .dev > li:before{display: none;}
	.graph-invil .dev:before{left: 50%; top:0; width: 1px; height: calc(100% - 50px); padding-top: 50px;}
	.graph-invil .dev .t{height: 55px; margin-bottom: 25px;}
	
	.tit-st1 .ab{position: static; text-align: right; margin-top: 10px; display: block;}
	
	.api_w .graph{padding: 15px}
	
	.page-contact .ico{width:80px; height: 80px; background-size:50%}
	.page-contact .box{flex-flow:column}
	.page-contact .bul-dot{width: 100%}
	
	.box-st2 .dev.col4{}
	.box-st2 .dev.col4 > li{width: 50%}
	.box-st2 .dev.col4 > li:nth-child(3){border-left: 0;}
	.box-st2 .dev.col4 > li:nth-child(n+3){margin-top: 30px;}
}

@media (max-width:480px){
	.vil-state_w > li{width: calc(100% - 15px)}
	.modal-st1 .bbs-info .item .t,.modal-st1  .bbs-info .item2 .t2,.modal-st1  .bbs-info .item .c{font-size: 13px;}
	
	.btn-small{padding: 10px}
}
@media (max-width:380px){
	#header .btns-etc > *:not(:first-child){margin-left: 10px;}
	#header .btns-etc .blank{font-size: 13px;}
	.bbs-file .items a{width: 100%}
	
	.steps-member{gap:15px}
	.steps-member > li:not(:first-child):before{left: -15px; width: 15px}
	
	.box-member{padding: 30px 20px}
	.login-etc{flex-flow:column;align-items: baseline; margin-bottom: 30px;}
	.login-etc .link{ width:100%; justify-content: center;  margin-top: 15px;}
}