/* No CSS */ /*# sourceMappingURL=device-width.css.map */
@media ( min-width : 768px) {
	.banner .swiper-container .swiper-slide a{
		background-size: 100% auto;
	}
	.array-design6 .row .col:nth-child(2){
		display:block;
	    padding: 0;	   
	}
	.array-design6 .row .box{
		 width: 100%;
   		height: 100%;
	}
	.array-design8 .row .col:nth-child(1){
	    background-size: auto 100%;
	}
	.array-design8 .row .col:nth-child(1) .box {
	    padding: 200px 0px 0px 0px;
	}
	.array-design9>.text-box {
	 left: 50%;
        top: 50%;
        width: auto;
        height: auto;
        margin: 0;
        transform: translate(-50%, -50%);
	}
	.total-search.integration-ver .category-box>ul li:nth-child(1) {
		width: 515px;
		margin-right: 25px;
	}
	.total-search.integration-ver .category-box>ul li:nth-child(2) {
		width: 90px;
	}
	.img-gallery{
		width:auto;
	}
	.detail-box .img-gallery li {
	    width: 165px;
	    height: auto;
	    margin-right: 15px;
	    display: inline-block;
	    vertical-align: top;
	    padding: 10px;
	}
	.array-design7 .svg-box .all-map svg {
    	width: 550px;
    }
    .card-list-box.new21-ver1 .img_box-box .img_box {
	    height: 185px;
	}
    .card-list-box.new21-ver1 .img_box-box .img_box2 {
	    height: 200px;
	}
	
	.card-list-box.new21-ver1 .img_box-box {
	    /*flex-grow: 0;
	    flex-basis: 160px;
	    max-width: 160px;*/
	}
	
	.card-list-box.new21-ver1 .img_box-box .img_box a img {
	    width: 100%;
	    position: absolute;
	    left: 50%;
	    top: 50%;
	    transform: translateX(-50%) translateY(-50%);
	}
	
	.card-list-box.new21-ver1 .img_box-box .img_box2 a img {
	    width: 100%;
	    position: absolute;
	    left: 50%;
	    top: 50%;
	    transform: translateX(-50%) translateY(-50%);
	}
	
	.card-list-box.new21-ver1 .text_box-box .btn_box {
	    text-align: left;
	    margin-top: 40px;
	}
    .new-21-detail-box{}
	.new-21-detail-box .top{}
	.new-21-detail-box .top .img-box{
    flex-grow: 0;
    flex-basis: 550px;
    max-width: 550px;
}
	.new-21-detail-box .top .img-box .img{}
	.new-21-detail-box .top .img-box .img img{}
	.new-21-detail-box .top .text-box{}
	.new-21-detail-box .top .text-box .title{}
	.new-21-detail-box .top .text-box span em{}
	.new-21-detail-box .top .btn-box{}
	.new-21-detail-box .top .btn-box .btn{}
	.new-21-detail-box .top .btn-box .btn i{}
	.new-21-detail-box .top .btn-box .btn.ver1{}
	.new-21-detail-box .top .btn-box .btn.ver1 i{}
	.new-21-detail-box .area-box{}
	.new-21-detail-box .icon-title{}
	.new-21-detail-box .icon-title p{}
	.new-21-detail-box .icon-title p i{}
	.new-21-detail-box .user-info{}
	.new-21-detail-box .user-info span{}
	.new-21-detail-box .user-info p{}
	.new-21-detail-box .lev-text{}
	.new-21-detail-box .lev-text p{}
	.new-21-detail-box .lev-text p i{}
	.new-21-detail-box .lev2{}
	.new-21-detail-box .lev2:last-child{}
	.custom-ver2 .modal-dialog {
		margin: 62px auto;
		width: 1000px;
	}

	.custom-ver2 .modal-content {
		border-radius: 16px;
		overflow: hidden;
	}

	.custom-ver2 .modal-header .close {
	}
    .card-list-box>.row>div>.box .img-box{
    	height:220px;
    }
    /*conetent7*/
	.content_7 .swiper-button-next {
		right: -40px;
	}
	.content_7 .swiper-button-prev {
		left: -40px;
	}
	.content_7 .swiper-wrapper .swiper-slide ul li {
		width: 25%;
	}
	.content_7 .swiper-button-next, .content_7 .swiper-button-prev {
	}
}
@media ( min-width : 1200px) {
	.datum-point {
		width: 1180px;
		margin: auto;
	}
	.sub-page .datum-point {
		width: 1140px;
	}
	.head .logo img {
		height: 70px;
		margin: 15px auto;
	}
	.head-box {
		padding: 0;
		height: 100px;
	}
	.head-box::before {
		height: 100px;
		background-color: rgb(0 0 0/ 50%);
		border-bottom: 0;
	}
	.head>.datum-point2, .pc-lev1-box>.datum-point2 {
		width: 1140px;
		margin: auto;
	}
	.head .menu-box>.menu-btn {
		display: none;
	}
	.head .menu-box>.menu {
		background: none;
		position: relative;
		height: auto;
		width: auto;
		left: 0;
		font-size: 0;
		text-align: right;
	}
	.head .menu-box>.menu>li {
		display: inline-block;
		padding: 0 50px;
	}
	.head .menu-box>.menu>li:nth-child(4), .head .menu-box>.menu>li:nth-child(5),
		.pc-lev1-box .lev1:nth-child(3), .pc-lev1-box .lev1:nth-child(4) {
		width: 190px;
	}
	.head .menu-box>.menu>li>a {
		font-size: 20px;
		color: #fff;
		letter-spacing: -1px;
		line-height: 100px;
		padding: 0;
		position: relative;
	}
	.head .menu-box>.menu>li>a.trans, .head .menu-box>.menu>li>a:hover {
		color: #007FE6;
		position: relative;
		padding: 0;
	}
	.head .menu-box>.menu>li>a.trans:before, .head .menu-box>.menu>li>a:hover:before,
		.head .menu-box>.menu>li>a.active:before {
		content: "";
		background: #007FE6;
		height: 5px;
		width: 100%;
		position: absolute;
		bottom: 0;
	}
	.sub-page .head-box:hover .menu-box .menu>li>a {
		color: #fff;
	}
	.sub-page .head-box.menu-fixed:hover .menu-box .menu>li>a {
		color: #2A2B2E;
	}
	.sub-page .head-box.menu-fixed:hover .menu-box .menu>li>a:hover {
		color: #007FE6;
	}
	.sub-page .head-box.menu-fixed:hover .menu-box .menu>li>a:before {
		background: #007FE6;
	}
	.sub-page .head .menu-box>.menu>li>a.trans, .sub-page .head .menu-box>.menu>li>a:hover
		{
		color: #17C6FF;
	}
	.sub-page .head .menu-box>.menu>li>a.trans:before, .sub-page .head .menu-box>.menu>li>a:hover:before
		{
		background: #17C6FF;
	}
	.sub-page .head .menu-box>.menu>li>a.trans, .sub-page .head .menu-box>.menu>li>a:hover
		{
		color: #17C6FF;
	}
	.sub-page .head .menu-box>.menu>li>a.trans:before, .sub-page .head .menu-box>.menu>li>a:hover:before
		{
		background: #17C6FF;
	}
	.sub-page .head .menu-box>.menu>li>a.active {
		color: #17C6FF;
	}
	.sub-page .head .menu-box>.menu>li>a.active:before {
		background-color: #17C6FF;
	}
	.sub-page .head-box.menu-fixed .menu-box>.menu>li>a.active {
		color: #007FE6;
	}
	.sub-page .head-box.menu-fixed .menu-box>.menu>li>a.active:before {
		background-color: #007FE6;
	}
	.head .menu-box>.menu>li>.lev1 {
		position: fixed;
		top: 100px;
		z-index: 10;
		width: 100%;
		overflow: hidden;
		left: 0;
		/* padding-top: 10px; */
		/* padding-left: 200px; */
		text-align: center;
		background: #F4F9FF;
	}
	.head .menu-box>.menu>li>.lev1 li {
		display: inline-block;
	}
	.head .menu-box>.menu>li>.lev1 a {
		padding-left: 0;
		color: #808080;
		font-size: 18px;
		letter-spacing: -1px;
		line-height: 65px;
		margin-right: 45px;
		font-weight: 400;
	}
	.head .menu-box>.menu>li>.lev1 a:hover {
		color: #007FE6;
		font-weight: bold;
	}
	.pc-lev1-box {
		max-height: 0;
		overflow: hidden;
		transition: 0.5s;
		position: fixed;
		left: 0;
		display: block;
		top: 100px;
		width: 100%;
		font-size: 0;
		opacity: 0.95;
		background-color: #FFFFFF;
	}
	.pc-lev1-box .lev1 {
		display: inline-block;
		text-align: left;
		padding-left: 82px;
		vertical-align: top;
		padding-top: 20px;
		padding-bottom: 20px;
		width: 170px;
		white-space: nowrap;
	}
	.pc-lev1-box .fake-support-box {
		margin-left: 30px;
		padding: 0;
		width: 50px;
		height: 100%;
		display: inline-block;
	}
	.pc-lev1-box ul.lev1 a {
		color: #2A2B2E;
		font-size: 16px;
		letter-spacing: -1px;
		line-height: 1;
		display: block;
		margin-bottom: 10px;
	}
	.pc-lev1-box ul.lev1 a:hover {
		color: #007FE6;
		font-weight: bold;
	}
	.pc-lev1-box ul.lev1 li:last-child a {
		margin-bottom: 0;
	}
	.pc-lev1-box.trans {
		max-height: 500px;
		transition: max-height 0.5s;
	}
	.head .menu-box>.menu+.bg {
		display: none;
	}
	.head-box.menu-fixed::before, .head-box:hover::before {
		background-color: #FFFFFF;
	}
	.head-box.menu-fixed {
		z-index: 100;
		position: fixed;
		border-bottom: 1px solid #A3A5AE;
	}
	.head-box.menu-fixed .menu-box .menu>li>a, .head-box:hover .menu-box .menu>li>a
		{
		color: #2A2B2E;
	}
	.sub-page .head-box::before {
		background-color: #272932;
	}
	.sub-page .head-box.menu-fixed::before {
		background-color: #FFFFFF;
		border-bottom: 1px solid #A3A5AE;
	}
	.sub-page .head .logo-w, .sub-page .head .logo-c {
		display: none !important;
	}
	.sub-page .head .logo-w.sub, .sub-page .head-box.menu-fixed .logo-c {
		display: block !important;
	}
	.sub-page .head-box.menu-fixed .logo-w.sub {
		display: none !important;
	}
	.sub-page .head-box.menu-box .menu>li>a {
		color: #fff;
	}
	.sub-page .head .menu-box>.menu>li>a.trans {
		color: #17C6FF !important;
	}
	.sub-page .head .menu-box>.menu>li>a.trans:before {
		background: #17C6FF;
	}
	.banner {
		height: 900px;
		padding-top: 100px;
	}
	.banner>.text-box {
		width: 1000px;
		height: 360px;
		left: 50%;
		margin-left: -500px;
		top: 50%;
		margin-top: -180px;
	}
	.banner>.text-box .text1 {
		font-size: 64px;
		letter-spacing: -4px;
	}
	.banner>.text-box .text2 {
		font-size: 42px;
		font-weight: 100;
		letter-spacing: -2.1px;
	}
	.banner>.text-box .text2::after {
		margin: 20px auto;
	}
	.banner>.text-box .text3 {
		font-size: 20px;
	}
	.banner .swiper-container .scroll-icon {
		display: inline;
		position: absolute;
		bottom: 80px;
		width: 100%;
		text-align: center;
		z-index: 1;
	}
	.banner .swiper-container .scroll-icon img {
		display: block;
		margin: 0px auto 15px auto;
	}
	.banner .swiper-container .scroll-icon p {
		color: #FFFFFF;
		font-size: 12px;
		font-weight: 500;
		letter-spacing: -0.7px;
	}
	.banner .search-box {
		display: block;
		margin-top: 33px;
	}
	.banner .search-box>.search {
		width: 453px;
		padding: 10px 30px;
		display: block;
	}
	.banner.sub {
		height: 530px;
		margin-top: 100px;
		text-align: right;
		/*background: #fffef1;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0.09) 0%,
			rgba(0, 0, 0, 0.03) 100%);*/
		padding: 0;
	}
	.banner.sub.ver1 {
		height: 365px;
	}
	.banner.sub .user-info {
		width: 1140px;
		left: 50%;
		margin-left: -570px;
		text-align: left;
		padding: 0;
	}
	.banner.sub:before {
		display: block;
		background: linear-gradient(326.26deg, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.5) 100%);
	}
	.banner.sub .user-info>.row>.col .user-face {
		width: 120px;
		height: 120px;
		margin-right: 30px;
	}
	.banner.sub .user-info>.row>.col .user-support-info {
		display: block;
	}
	.banner.sub .page-site-info {
		padding: 0;
		top: 226px;
		text-align: left;
		position: absolute;
	}
	.banner.sub .page-site-info p {
		font-size: 64px;
		/*font-family: Arita-buri;*/
		font-weight: 400;
	}
	.banner.sub.ver1 .page-site-info {
		padding: 0;
		top: 116px;
		text-align: left;
	}
	.banner.sub.total-search-ver {
		height: 504px;
	}
	.py-custom-value1 {
		padding-top: 4.3rem;
		padding-bottom: 4.3rem;
	}
	.h1-title {
		font-size: 58px;
	}
	.title-info1 {
		font-size: 24px;
	}
	.title-info2 {
		font-size: 24px;
	}
	.title-info3 {
		font-size: 24px;
	}
	.title2 {
		font-size: 36px;
	}
	.title2.icon-in i {
		font-size: 48px;
	}
	.array-design3 .row {
		padding: 0;
	}
	.array-design3 .col {
		margin-bottom: 0rem;
		padding-right: 15px;
		padding-left: 15px;
	}
	.array-design3 .col:nth-child(3), .array-design3 .col:nth-child(4) {
		margin-top: 25px;
	}
	.array-design3 .col>.box {
		border: 1px solid #ccc;
		border-color: #D9D9D9;
		height: auto;
		width: auto;
		-webkit-box-shadow: inset 0 -1px 0 0 #7E95A7;
		box-shadow: inset 0 -1px 0 0 #7E95A7;
	}
	.array-design3 .col>.box>.box-top>.text-box {
		font-size: 18px;
		padding: 0 30px;
	}
	.array-design3 .col>.box>.box-top>.text-box2 {
		padding: 0 30px;
		font-size: 18px;
	}
	.array-design4 .row>.col:first-child {
		margin-bottom: 0;
	}
	.array-design4 .nav-tabs .nav-item .nav-link {
		font-size: 24px;
	}
	.array-design4 .tab-content {
		margin-top: 26px;
		height: auto;
		overflow: inherit;
	}
	.array-design4 .tab-content table td a p {
		font-size: 18px;
	}
	.array-design5 .h1-title.design-border2 {
		padding: 0;
	}
	.array-design5 .h1-title.design-border2>span::before, .array-design5 .h1-title.design-border2>span::after
		{
		height: 58px;
	}
	.array-design5 .h1-title.design-border2>.info {
		margin-left: 20px;
	}
	.array-design5 .nav-tabs {
		padding: 15px 0;
	}
	.array-design5 .nav-tabs .more {
		right: 0;
	}
	.array-design5 .row .col:last-child {
		padding-right: 0;
	}
	.array-design5 .row .col:first-child {
		padding-left: 0;
	}
	.array-design5 .row .col:nth-child(1), .array-design5 .row .col:nth-child(2),
		.array-design5 .row .col:nth-child(3) {
		margin-bottom: 0px;
	}
	.array-design5 .row .col .box img {
		height: 250px;
	}
	.array-design6 .row .box {
		width: 590px;
		height: 642px;
	}
	.array-design6 .row .col:nth-child(1) {
		padding: 80px 0;
	}
	.array-design6 .row .col:nth-child(1) .box {
		padding: 70px 0 70px 64px;
		border-right: 0;
	}
	.array-design6 .row .col:nth-child(2) {
		padding: 80px 0;
		background-size: 100%;
		display:block;
	    
	}
	.array-design6 .row .col:nth-child(2) .box {
		border-left: 0;
		padding: 200px 0 79px 70px;
	}
	.array-design6 .row .col:nth-child(1) .box>ul {
		margin-top:150px;
	}
	.array-design7 {
		height: 800px;
		padding: 0;
		padding-top: 66px;
	}
	.array-design7 .svg-box{
		display:block;
		    position: static;
	}
	.array-design7 .svg-box .all-map svg {
		position: absolute;
		right: -171px;
		top: 14px;
		width: 1169px;
		height: 697px;
		z-index: 10;
	}
	.array-design7 .svg-box .all-map>ul {
		position: absolute;
	}
	.array-design7 .svg-box .all-map>ul li {
		color: #020303;
		margin: 0;
		width: 85px;
		text-align: center;
		position: absolute;
	}
	.array-design7 .svg-box .all-map>ul li:before, .array-design7 .svg-box .all-map>ul li p:before,
		.array-design7 .svg-box .all-map>ul li p:after {
		display: none;
	}
	.array-design7 .svg-box .all-map>ul li p {
		color: #020303;
		font-size: 14px;
		font-weight: 500;
		line-height: 1;
		letter-spacing: 0;
		margin-bottom: 0;
		display: inline-block;
		font-family: 'notokr';
	}
	.array-design7 .svg-box .all-map>ul li span {
		height: 17px;
		display: inline-block;
		width: auto;
		color: #FFFFFF;
		font-size: 11px;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0;
		border-radius: 8px;
		background-color: #FF4A7A;
		line-height: 17px;
		margin-left: 3px;
		padding: 0 3px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(1) {
	    left: 202px;
    	top: 97px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(2) {
		left: 590px;
		top: -44px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(3) {
		left: 484px;
		top: -193px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(4) {
		left: 583px;
		top: -193px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(5) {
		left: 623px;
		top: -133px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(6) {
		left: 670px;
		top: -204px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(7) {
		left: 621px;
		top: -268px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(8) {
		left: 725px;
		top: -343px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(9) {
		left: 746px;
		top: -249px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(10) {
		left: 829px;
		top: -322px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(11) {
		left: 979px;
		top: -357px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(12) {
		left: 942px;
		top: -204px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(13) {
		left: 731px;
		top: -164px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(13) p {
		display: block;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(14) {
		left: 784px;
		top: -162px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(14) p {
		display: block;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(15) {
		left: 845px;
		top: -138px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(16) {
		left: 881px;
		top: -71px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(17) {
		left: 943px;
		top: -91px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(18) {
		left: 767px;
		top: 27px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(19) {
		left: 852px;
		top: 4px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(20) {
		left: 825px;
		top: 102px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(21) {
		left: 947px;
		top: 77px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(22) {
		left: 939px;
		top: 28px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(23) {
		left: 939px;
		top: -8px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(24) {
		left: 1102px;
		top: -41px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(25) {
		left: 759px;
		top: -65px;
	}
	.array-design7 .svg-box .detail-map>p {
		color: #FFFFFF;
		font-size: 74px;
		font-weight: 600;
		letter-spacing: -1.85px;
		margin-bottom: 0;
		line-height: 1.3;
		font-family: 'notokr';
		position: absolute;
		right: 0;
		bottom: 100px;
		z-index: 1;
	    right: -75px;
	}
	.array-design7 .svg-box .detail-map>p>span {
		color: #FFFFFF;
		font-size: 36px;
		letter-spacing: -1px;
		display: block;
		font-family: 'notokr';
	}
	.array-design7 .svg-box .detail-map>p>em {
		opacity: 0.7;
		color: #FFFFFF;
		font-size: 18px;
		letter-spacing: -1px;
		opacity: 0.7;
	}
	.array-design7 .svg-box .detail-map>p:after {
		display: none;
	}
	.array-design7 .svg-box .detail-map>ul {
		position: absolute;
		right: 0;
		width: 600px;
		height: 650px;
		top: 0;
		z-index: 1;
		
	}
	
	.array-design7 .svg-box .detail-map>ul>li {
		font-size: 0;
		margin-bottom: 0;
		position: absolute;
	}
	.array-design7 .svg-box .detail-map>ul>li:nth-child(1) {
		left: 217px;
		top: 243px;
	}
	.array-design7 .svg-box .detail-map>ul>li:nth-child(2) {
		left: 217px;
		top: 377px;
	}
	.array-design7 .svg-box .detail-map>ul>li:nth-child(3) {
		left: 387px;
		top: 440px;
	}
	.array-design7 .svg-box .detail-map>ul>li:nth-child(4) {
		left: 349px;
		top: 303px;
	}
	.array-design7 .svg-box .detail-map>ul>li:before, .array-design7 .svg-box .detail-map>ul>li>p:after
		{
		display: none;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle {
		height: 28px;
		width: 28px;
		border-radius: 28px;
	}
	.array-design7 .svg-box .detail-map>ul>li>.hover-text {
		display: none;
		transition: all 0.5s;
	}
	.array-design7 .svg-box .detail-map>ul>li:hover>.hover-text {
		display: block;
		position: absolute;
		top: -40px;
		width: auto;
		border-radius: 4px;
		background-color: #FFFFFF;
		box-shadow: 0 8px 16px 0 rgba(55, 70, 95, 0.07);
		color: #2A2B2E;
		font-family: 'notokr';
		font-weight: bold;
		font-size: 16px;
		text-align: center;
		letter-spacing: -1px;
		padding: 0 10px;
		margin-bottom: 0;
		line-height: 30px;
		left: -100%;
		margin-left: -100%;
		white-space: nowrap;
		opacity: 1;
		z-index: 2;
	}
	.array-design7 .svg-box .detail-map>ul>li:hover>.cycle:before
		{
		content: "";
		width: 15px;
		height: 15px;
		background: #fff;
		position: absolute;
		top: -18px;
		left: 15px;
		margin-left: -10px;
		transform: rotate(45deg);
		z-index: 1;
	}
	.array-design7 .svg-box .detail-map>ul>li:hover>.hover-text span {
		color: #808080;
		font-size: 15px;
		letter-spacing: -1px;
		font-family: 'notokr';
		font-weight: 400;
		display: inline-block;
		margin-right: 5px;
		vertical-align: top;
	}
	.array-design7 .svg-box .detail-map>ul>li:hover>.hover-text span {
		color: #808080;
		font-size: 15px;
		letter-spacing: -1px;
		font-family: 'notokr';
		font-weight: 400;
		display: inline-block;
		margin-right: 5px;
		vertical-align: top;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle.color1 {
		background-color: #51A394;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle.color2 {
		background-color: #FF8B00;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle.color3 {
		background-color: #5B95C9;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle.color4 {
		background-color: #EE736C;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle.color5 {
		background-color: #956DAD;
	}
	.array-design7 .svg-box .detail-map>ul>li .cycle.color6 {
		background-color: #e44255;
	}
	.array-design7 .svg-box .detail-map svg {
		position: absolute;
		right: 0;
		top: 14px;
		height: 650px;
		width: auto;
		display: none;
		width: 0;
		overflow: hidden;
		height: 0;
	}
	.array-design7 .svg-box .detail-map svg.trans {
		display: block;
		right: 60px;
		/* z-index: 10; */
		max-width: 600px;
		height: 650px;
		width: auto;
	}
	.array-design7 .svg-box .detail-map #jungangdong_d.trans{
		right: -50px;
	}
	.array-design7 .svg-box .detail-map #wolpidong_d.trans{
		width: 360px;
	}
	@media screen and (-webkit-min-device-pixel-ratio:0){ 

		
		.array-design7 .svg-box .detail-map #jungangdong_d.trans{
			    right: 110px;
		}
	}
	.array-design7 img {
		display: inline;
		position: absolute;
		right: -100px;
		top: 30px;
	}
	.array-design7 .svg-box .detail-map {
		position: absolute;
		right: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 9;
	}
	.array-design7 .svg-box .detail-map.trans{
		    height: 100%;
	}
	.array-design7 .svg-box .all-map {
		
z-index: 10;
	}
	.array-design7 .svg-box .detail-map>button {
		z-index: 5;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(1), .array-design7 .svg-box .detail-map>button:nth-child(2)
		{
		font-size: 0;
		background: none;
		border: 0;
		padding: 0;
		position: absolute;
		height: 45px;
		width: 45px;
		bottom: 325px;
		border-radius: 45px;
		border: 3px solid #fff;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(1) {
		left: 325px
	}
	.array-design7 .svg-box .detail-map>button:nth-child(2) {
		right: 0;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(1):before,
		.array-design7 .svg-box .detail-map>button:nth-child(2):before {
		content: '';
		font-family: "epicfont";
		font-size: 41px;
		color: #fff;
		/* border: 3px solid #fff; */
		text-align: center;
		margin: 0;
		position: relative;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(1):before {
		content: '\e819';
		position: relative;
		left: -2px;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(2):before {
		content: '\e81d';
		right: -1px;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(3) {
		color: #FFFFFF;
		font-size: 20px;
		font-weight: 500;
		letter-spacing: -1px;
		line-height: 29px;
		text-align: center;
		background: none;
		display: inline-block;
		box-sizing: border-box;
		height: 45px;
		width: 203px;
		border: 1px solid #FFFFFF;
		border-radius: 22.5px;
		padding: 0;
		position: absolute;
		right: 0px;
	    bottom: 50px;
	    right: -135px;
	}
	.array-design7 .svg-box .detail-map>button:nth-child(3):before {
		content: '\e81b';
		font-family: "epicfont";
	}
	.array-design8 .row .box {
		width: 590px;
	}
	.array-design8 .row .col:nth-child(1) {
		background-size: auto 100%;
		height: 800px;
		position: relative;
	}
	.array-design8 .row .col:nth-child(1) .box {
		padding: 200px 0px 0px 0px;
	}
	.array-design8 .row .col:nth-child(1) .box>span {
		font-size: 20px;
	}
	.array-design8 .row .col:nth-child(1) .box p {
		font-size: 49px;
	}
	.array-design8 .row .col:nth-child(1) .box p::after {
		margin: 20px auto 30px auto;
	}
	.array-design8 .row .col:nth-child(2) {
		height: 800px;
	}
	.array-design8 .row .col:nth-child(2) .box {
		padding: 50px 0 0 50px;
	}
	.array-design9 {
		height: 900px;
	}
	.array-design9>.text-box {
		left: 50%;
        top: 50%;
        width: auto;
        height: auto;
        margin: 0;
        transform: translate(-50%, -50%);
	}
	.array-design9>.text-box .text1 {
		font-size: 20px;
		letter-spacing: -1px;
	}
	.array-design9>.text-box .text2 {
		font-size: 64px;
		letter-spacing: -4px;
		font-weight: 100;
		letter-spacing: -2.1px;
	}
	.array-design9>.text-box .text2::after {
		margin: 20px auto;
	}
	.array-design9>.text-box .text3 {
		padding: 0;
		font-size: 20px;
		letter-spacing: -1px;
		margin-bottom: 80px;
	}
	.array-design9>.text-box ul li {
		margin-right: 25px;
	}
	.array-design9>.text-box ul li .btn {
		width: 231px;
		height: 45px;
		line-height: 45px;
		font-size: 20px;
		padding: 0;
	}
	.array-design10 .swiper-button-prev {
		left: -25px;
	}
	.array-design10 .swiper-button-next {
		right: -25px;
	}
	.footer>.datum-point2 {
		width: 1140px;
		margin: auto;
	}
	.array-design8 .img-gallery li>.img {
		height: 315px;
	    background-size: 100% 100%;
	    background-position-y: center;
	    border: 0;
	}
	.array-design9 .background-img-ver {
		background-size: 100% auto;
	}
	.sub-content .duble-box>.row>.col:first-child {
		width: 885px;
		max-width: 885px;
		margin-right: 30px;
		margin-left: 0;
		padding: 0;
	}
	.sub-content .duble-box>.row>.col:last-child {
		display: block;
	}
	.sub-content .content-box>.result-box>ul>li.text2 {
		padding-left: 40px;
		width: 675px;
	}
	.paging-box>ul>li:first-child {
		margin-right: 25px;
	}
	.paging-box>ul>li:last-child {
		margin-left: 25px;
	}
	.paging-box>ul>li a {
		width: 36px;
		font-size: 14px;
	}
	.total-search {
		margin-left: 0px;
		margin-right: 0px;
		width: 100%;
		top: -65px;
		margin: 0;
	top:0;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
    margin-top: -125px;
    margin-bottom: 50px;
		
	}
	.total-search.multy-search {
		/*top: -122px;*/
	}
	.total-search .category-box>ul li {
		display: inline-block;
		margin-right: 30px;
	}
	.total-search .category-box>ul.info>li {
		width: 12%;
		padding: 16px 0;
	}
	.total-search .category-box>ul.info>li:nth-child(1), .total-search .category-box>ul.info>li:nth-child(2)
		{
		width: 26%;
	}
	.total-search.menu-list-ver {
		top: 0;
		margin-top: -25px;
	}
	.total-search.menu-list-ver.new21-ver1{
		margin-top: -57px;
	}
	.total-search.menu-list-ver.fixed {
		position: fixed;
		top: 125px;
		left: 0;
		border-radius: 0;
		background: #F4F9FF;
		z-index: 9;
	}
	.total-search.menu-list-ver.fixed .category-box {
		width: 1140px;
		margin: auto;
	}
	.total-search.menu-list-ver .category-box ul li:after {
		display: none
	}
	.total-search.menu-list-ver .category-box ul li:first-child::after {
		content: "";
		width: 1px;
		height: 25px;
		background-color: #CECECE;
		margin: 0 25px;
		display: inline-block;
		vertical-align: top;
	}
	.total-search.menu-list-ver .category-box ul li {
		margin-right: 45px;
		vertical-align: top;
	}
	.total-search.menu-list-ver .category-box ul li:last-child {
		margin-right: 0;
	}
	.total-search.menu-list-ver .category-box ul li:first-child {
		display: inline-block;
	}
	.search-term {
		font-size: 28px;
	}
	.search-term span {
		font-size: 51px;
	}
	.result-box .table-box table {
		width: 100%;
	}
	.img-gallery {
		width: auto;
	}
	.array-design8 .img-gallery {
		width: 245px;
		margin-right: 30px;
	}
	.array-design8 .img-gallery li {
		width: 245px;
	}
	.fluent-design .slider-box>ul>li {
		overflow: hidden;
		width: 50%;
		padding-right: 15px;
	}
	.fluent-design .slider-box>ul>li:first-child>div {
		border-radius: 4px;
	}
	.fluent-design .slider-box>ul>li:first-child {
		height: 637px;
	}
	.fluent-design .slider-box>ul>li:last-child {
		height: 637px;
	}
	.fluent-design .slider-box>ul>li>ul>li {
		border-radius: 4px;
		overflow: hidden;
		width: 270px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver1 {
		margin-right: 15px;
		margin-bottom: 15px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver2 {
		margin-bottom: 15px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver2 .text-box {
		bottom: 80px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver2 .text-box .text span {
		margin-top: 30px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver3 {
		margin-right: 15px;
		height: 347px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver3 .title {
		top: 35px;
		padding: 0 35px;
	}
	.fluent-design .slider-box>ul>li>ul>li.ver4 {
		height: 347px;
		border: 1px solid rgba(183, 210, 229, 0.8);
	}
	.fluent-design .slider-box>ul>li>ul>li.ver4 img {
		height: 220px;
	}
	.back-img-design {
		padding: 50px 0;
	}
	.back-img-design .row>.col .box .text-box {
		font-size: 38px;
	}
	.new-notice-design .box>li {
		padding: 20px 30px;
	}
	.new-notice-design .box>li:nth-child(2) {
		max-width: 895px;
		padding: 34px 0px;
	}
	.new-notice-design .box>li:nth-child(3) {
		padding: 41px 30px;
	}
	.new-notice-design .box>li:nth-child(3) i {
		font-size: 36px;
	}
	.fixed-navigation {
		display: inline;
		position: fixed;
		right: 0;
		width: 65px;
		height: 100vh;
		z-index: 100;
		border-left: 1px solid #A3A5AE;
		padding-top: 50px;
		margin-top: 100px;
		margin-bottom: 320px;
	}
	.fixed-navigation>ul>li>a {
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		letter-spacing: -1px;
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		padding: 10px 0;
		padding-left: 15px;
		display: block;
		letter-spacing: -4.5px;
		text-shadow: 0px 0px 6px #000;
		position: relative;
		/*
                &.navigation-banner{}
                &.navigation-array-design6{}
                &.navigation-array-design7{}
                &.navigation-array-design8{}
                &.navigation-array-design9{}
                &.navigation-array-design10{}
                */
	}
	.fixed-navigation>ul>li>a:hover:before, .fixed-navigation>ul>li>a.active:before
		{
		content: "";
		width: 5px;
		height: 100%;
		position: absolute;
		left: 0;
		background: #fca200;
	}
	.detail-box .swiper-button-prev {
		left: -75px;
	}
	.detail-box .swiper-button-next {
		right: -75px;
	}
	.detail-box .full-slide-ver .swiper-button-next, .detail-box .full-slide-ver .swiper-button-prev
		{
		top: 325px;
	}
	.detail-box .full-slide-ver .swiper-slide {
		height: 700px;
		text-align: center;
	}
	.custom-ver .modal-header .close{
	    right: -33px;
    	top: -9px;
	}
	.custom-ver .modal-dialog {
		max-width: 885px;
	}
	.custom-ver .swipe-box .swiper-slide {
		height: 493px;
	}
	.detail-box .box {
		margin-bottom: 50px;
	}
	.card-list-box1 li {
		
	}
	.card-list-box1 li .box {
		height: 184px;
		margin-bottom: 20px;
	}
	.desigh-cycle1-box .bg-pattern {
		margin-top: 130px;
	}
	.desigh-cycle1-box>.row {
		margin-top: 137px;
	}
	.desigh-cycle1 {
		width: 214px;
		height: 214px;
		border-radius: 50%;
		border-width: 5px;
		margin: auto;
		margin-top: -145px;
	}
	.desigh-cycle1>div p {
		font-size: 18px;
		padding-bottom: 0.5rem;
		padding-top: 1.5rem;
	}
	.desigh-cycle1>div.bg-w p {
		margin: 0;
		letter-spacing: 0px;
	}
	.desigh-table1 .th {
		width: 190px;
	}
	.desigh-table1 .col.flex-grow-0 {
		flex: 190px;
	}
	.time-photo {
		height: auto;
		margin-bottom: 40px;
		width: auto;
		background-size: auto;
	}
	.time-photo>div {
		display: inline-block;
		width: 500px;
		height: auto;
		padding: 30px 50px;
		position: relative;
		/* padding-bottom: 74px; */
		vertical-align: top;
	}
	.time-photo>div:nth-child(1) {
		margin-right: 50px;
		transform: rotate(-2deg);
	}
	.time-photo>div:nth-child(2) {
		transform: rotate(2deg);
	}
	.total-search.integration-ver {
		top: -45px;
	}
	.total-search.integration-ver .category-box>ul {
		font-size: 0;
	}
	.total-search.integration-ver .category-box>ul>li {
		margin-right: 25px;
	}
	.total-search.integration-ver .category-box>ul li:nth-child(1) {
		width: 815px;
	}
	.total-search.integration-ver .category-box>ul li:nth-child(2) {
		width: 96px;
	}
	.total-search.integration-ver .category-box>ul li:nth-child(3) {
		width: 115px;
	}
	.total-box .center .base-box1>.top .capsule-btn {
		float: right;
		margin-top: 0;
	}
	.total-box .center .list .img-text-ver .img-box {
		flex-basis: 200px;
	}
	.total-box .center .list .img-text-ver .text-box a {
		width: 115px;
		padding: 0;
		margin-right: 13px;
	}
	.array-design10 .col:nth-child(1) img {
		width: 100%;
		height: 448px;
	}
	.banner .search-box>.search.icon-in>a>i {
		top: 5px;
	}
	.banner.sub .page-site-info span, .banner.sub .page-site-info p, .banner.sub.ver1 .page-site-info ul li:first-child,
		.banner.sub .page-site-info ul li i, .banner.sub .page-site-info ul li,
		.banner.sub .page-site-info ul li:first-child, .banner.sub .page-site-info ul li i,
		.banner.sub .page-site-info ul li:last-child {
		color: #fff;
	}
	.card-list-box>.row>div>.box .img-box {
		height: 285px;
	}
	.card-list-box>.row>div>.box .img-box a img {
		min-height: 100%;
	}
	/*bg-img*/
	.bg-img1 {
		background-image: url('/resources/site/img/희망곳간 - 08.jpg') !important;
		background-size: 100% auto !important;
	}
	.bg-img2 {
		background-image: url('/resources/site/img/희망곳간 - 07.jpg') !important;
		background-size: 100% auto !important;
	}
	.bg-img3 {
		background-image: url('/resources/site/img/희망곳간 - 01.jpg') !important;
		background-size: 100% 100% !important;
	}
	.bg-img4 {
		background-image: url('/resources/site/img/희망곳간 - 02.jpg') !important;
		background-size: 100% auto !important;
	}
	.bg-img5 {
		background-image: url('/resources/site/img/희망곳간 - 06.jpg') !important;
		background-size: auto 100% !important;
	}
	
	.banner.sub>div{
	    height: 100%;
	}
	.tab-top ul li a {
		font-size: 26px;
	}
	.head .menu-box>.menu>li.support-box .input-box {
    	display: none;
	}
	
	.head .menu-box>.menu>li.support-box>a{
	    border: 0;
	    margin: 0;
	    line-height: 100px;
        opacity: 1;
            display: block;
	}
	
	.head .menu-box>.menu>li.support-box {
	    border: 0;
	    margin-top: 0;
	    padding: 0;
	}
	.head .menu-box>.menu>li.support-box.trans {
		position: absolute;
		right: 0;
		width: auto;
	}
	.head .menu-box>.menu>li.support-box.trans>.input-box {
		display: inline-block;
		width: 275px;
		position: relative;
		border-radius: 5px;
		overflow: hidden;
		margin: 32px 0;
	}
	.head .menu-box>.menu>li.support-box.trans>.input-box input {
		border: 0;
		border-radius: 0;
		width: 100%;
	    color: #000;
   		font-size: 14px;
	}
	.head .menu-box>.menu>li.support-box.trans>.input-box a {
		top: 0;
		position: absolute;
		right: 0;
		color: #437dff;
		font-size: 21px;
		line-height: 36px;
	}
	.banner.sub.bottom{
		background-position-y: bottom;
	}
	.banner.sub.center{
		background-position-y: center;
	}
	.banner.sub.top{
		background-position-y: top;
	}
	.grop-box.ver1>ul>li {
	   width: 358px;
	   min-height: 450px;
	   display: inline-block;
	   margin-right: 30px;
	}
	.grop-box.ver1>ul>li:last-child{
	    margin-right:0;
	}
	.custom-d-md-block{
	    display: block !important;
	}
	.banner .swiper-container .swiper-slide a {
		background-size: 100% auto;
	}
	
	.detail-box .img-gallery li {
		width: 260px;
		height: 300px;
		margin-right: 30px;
	}
	.array-design7 ul li {
		margin-bottom: 20px;
		font-size: 14px;
		font-weight: 100;
		color: #fff;
	    display: block;
	}
	
	.array-design7 ul li::before {
		content: "";
		height: 13px;
		width: 13px;
		border-radius: 13px;
		display: inline-block;
		vertical-align: middle;
		margin-right: 15px;
	}
	.detail-box .text2 .img.float-right {
		max-width: 550px;
		margin: 20px;
		margin-top: 0;
		border-radius: 5px;
		float:right !important;
	}
	
	.detail-box .full-slide-ver .swiper-slide .img-box {
		height: 100%;
		width:auto;
	}
	.sub-content.content-ver>.datum-point, .sub-content.content-ver>.bg-pattern>.datum-point {
	    padding: 50px 0px;
	}
	.img-text-ver1{
	
	}
	.img-text-ver1 img{
		    float: right;
    max-width: 450px;
    margin: 0;
    margin-left: 30px;
	}
	
	
	
	
}

@media (min-width : 1200px) and (max-width : 1440px) {
	.array-design7 .svg-box .all-map svg {
	    position: absolute;
	    right: 0;
	    top: 14px;
	    width: 900px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(1) {
	    left: 271px;
	    top: -42px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(2) {
		left: 538px;
		top: -160px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(3) {
		left: 477px;
		top: -267px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(4) {
		left: 570px;
		top: -275px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(5) {
		left: 602px;
		top: -230px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(6) {
		left: 641px;
		top: -269px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(7) {
		left: 606px;
		top: -329px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(8) {
		left: 680px;
		top: -380px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(9) {
		left: 696px;
		top: -306px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(10) {
		left: 761px;
		top: -362px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(11) {
		left: 874px;
		top: -392px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(12) {
		left: 851px;
		top: -271px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(13) {
		left: 682px;
		top: -242px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(13) p {
		display: block;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(14) {
		left: 724px;
		top: -241px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(14) p {
		display: block;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(15) {
		left: 782px;
		top: -224px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(16) {
		left: 802px;
		top: -164px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(17) {
		left: 847px;
		top: -185px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(18) {
		left: 703px;
		top: -97px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(19) {
		left: 773px;
		top: -107px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(20) {
		left: 761px;
		top: -36px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(21) {
		left: 851px;
		top: -55px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(22) {
		left: 849px;
		top: -91px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(23) {
		left: 855px;
		top: -121px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(24) {
		left: 980px;
		top: -128px;
	}
	.array-design7 .svg-box .all-map>ul li:nth-child(25) {
		left: 705px;
		top: -167px;
	}
	.array-design7 .svg-box .detail-map>ul{
		height:450px;
	}
	.array-design7 .svg-box .detail-map svg.trans{
		/*height:450px;*/
	}
	.array-design7 .svg-box .detail-map>button:nth-child(3),
	.array-design7 .svg-box .detail-map>p{
		right:0;
	}
	.array-design9 .background-img-ver{
		background-size: auto 100%;
	}
	.banner .swiper-container .swiper-slide a {
		background-size: auto 100%;
	}
	
}
/*사파리용 css*/
@media not all and (min-resolution:.001dpcm) { 	
	.detail-box .swiper-pagination{
		buttom:-18px;
	}
}

@media ( min-width : 1200px) {
	.swiper-slide>.text-box {
		width: 1000px;
		height: 360px;
		left: 50%;
		margin-left: -500px;
		top: 50%;
		margin-top: -180px;
	}
	.swiper-slide>.text-box .text1 {
		font-size: 64px;
		letter-spacing: -4px;
	}
	.swiper-slide>.text-box .text2 {
		font-size: 42px;
		font-weight: 100;
		letter-spacing: -2.1px;
	}
	.swiper-slide>.text-box .text2::after {
		margin: 20px auto;
	}
	.swiper-slide>.text-box .text3 {
		font-size: 20px;
	}
	
	.tab-design-box-ver .title-1 {
	line-height: 82px;
	padding: 0 50px;
	font-size: 46px;
  
  	}
  	.tab-design-box-ver .title-1 span{display:inline-block;}
	 .tab-design-box1>ul.swiper-pagination-bullets .swiper-pagination-bullet {margin-right: 35px;}
	
	
}