@charset "utf-8";

/* CSS Document */

/* LAYOUT - responsive */
@media all and (max-width:1600px){ 
	.gnbwrap, .inner-wrap-gnb2 {
		width: 800px;
	}
	.banner-wrap-gnb2 {
		left: 5%;
	}
	ul.gnb2 li a {
		font-size: 0.95rem;
	}
}

@media all and (max-width:1440px){
	html {
		font-size: 15px;
	}
	.gnbwrap, .inner-wrap-gnb2 {
		width: 700px;
	}
	ul.gnb2 li a {
		font-size: 0.9rem;
	}
	
	/***** main *****/
	.noticeslide_box, .bx-viewport, p.slideimg img {
		height: 400px;
	}
	
	.cont_slide {
	    padding-top: 90px;
	}
	
	#container, #maincont2_newcont {
		max-width: 100%;
	}
	
	#maincont2_newcont {
	    width: 95%;
	}
	
	/***** sub *****/
	ul.work-process li:after {
		right: -10px;
	}
}

@media all and (max-width:1300px){
	.gnbwrap, .inner-wrap-gnb2 {
		width: 80%;
	}
	.top_wrap header h1 {
		position: static;
		background-color: #fff;
		text-align: center;
		width: 100%;
	}
	#gnb {
		position: static;
		height: 70px;
	}
	ul.gnb1 > li > a {
		height: 70px;
		line-height: 70px;
	}
	.wrap-gnb2 {
		top: 150px;
	}
	.banner-wrap-gnb2 {
		display: none;
	}
	
}

@media all and (max-width:1024px){
	/***** header *****/
	.gnbwrap {
		width: 100%;	
	}
	
	.top_line {
		display:none;
	}
	
 	/***** mobile menu on *****/
 	.top_wrap {
 		height: 100%;
 		background-color: #fff;
 	}
	
	.top_wrap>.top-right, #gnb, #left_gnb {
		display: none;
	}

	.top_wrap header h1, .top_wrap header h1 a {
		width: 100%;
		left: 0;
	}
	
	.nav_wrap {
		display: block;
	}
	
	.nav_btn {
	    display: block;
	}
	
	.top-right {
	    right: 50%;
	    top: 68px;
	    margin-right: -130px;
	}
	
	.top-right ul li a {
		border: 1px solid #fff;
	    color: #fff;
	}

	/***** main *****/
	.noticeslide_box, .bx-viewport, p.slideimg img {
	    height: 400px;
	}

	.cont_slide {
	    padding-top: 80px;
	}

	.notice_box {
	    padding-bottom: 0;
	    grid-template-columns: 100%;
	    gap: 30px;
	}
	
	.maincont2 {
	    width: 90%;
	    margin: 0 auto;
	}	

	.morebtn {
	    background-size: 20px auto;
	}

	#maincont2_right {
	    height: 250px;
	}

	/***** sub *****/
	.sub-header {
		height: 250px;
	}
	
	.title_box {
		padding-top: 0;
	}
	
	.location {
		bottom: -90px;
	}
	
	.sub_cont {
		grid-template-columns: 100%;
	}
	
	.cont_right {
		width: 100%;
		margin: 0 auto;
		
	}
	.cont_box {
	    padding: 20px;
	}
	
	
	ul.work-process {
	    gap: 10px;
	    width: 100%;
	    font-size: 0.75rem;
	}
	
	ul.work-process li:before {
	    width: 80px;
	    height: 80px;
	    left: 50%;
	    margin-left: -40px;
	    padding-top: 10px;
	    font-size: 0.6rem;
	}
	
	ul.work-process li:after {
	    right: -11px;
	    top: 40px;
	}
	
	.work-process i {
	    top: 25px;
	    margin-left: -17.5px;
	    font-size: 35px;
	}
	
	/***** footer *****/
	.ft_wrap {
	    padding-left: 7%;
	    padding-right: 5%;
	    width: 94%;
	}
}

@media all and (max-width:768px) {	
	html {
		font-size: 14px;
	}

	/***** header *****/
	.top_wrap header h1 a {
	    width: 130px;
	    background-size: 130px auto;
	}

	/***** main *****/
	.noticeslide_box, .bx-viewport, p.slideimg img {
	    height: 350px;
	}
		
	#maincont2_right {
	    height: 240px;
	    gap: 12px;
	}
	
	/***** sub *****/
	.sub-header {
		height: 200px;
	}
	
	.cont_box {
	    padding: 15px;
	}
	
	.title_box {
		margin-top: -15px;
		padding: 0 20px;
	}
	
	.location {
	    width: 100%;
	    text-align: right;
	    border-bottom: 1px solid #eee;
	    padding: 8px 20px;
	    bottom: -110px;
	}
	
	.greeting p.c br, .compete p.c br, .rnd p.c br {
		display: none;
	}
	
	.history .sub-img {
	    position: absolute;
	    left: 0;
	    margin-left: 0;
	    width: 150px;
	}
	.history .cont-sub-img {
	    position: absolute;
	    left: 150px;
	    width: auto;
	    margin-top: 245px;
	}
	
	ul.work-process {
	    grid-template-columns: repeat(3, 1fr);
	    gap: 20px;
	    width: 100%;
	    margin: 30px auto;
	    font-size: 0.85rem;
	}
	
	ul.steps-4 {
		grid-template-columns: repeat(4, 1fr);
	}	
	
	ul.steps-4 li:after {
	    right: -18px;
	}

	/***** footer *****/
	.add_wrap .foot_logo {
	    position: static;
	    margin-bottom: 15px;
	}
	
	.add_wrap .foot_logo img {
	    width: 120px;
	}
	.add_wrap div:nth-child(2) {
		margin-left: 0 !important;
	}	
}

@media all and (max-width:740px){
	.maincont2_menu>a{height:60px;}
	.maincont2_menu{height:auto;}
}

@media all and (max-width:640px){	
	/***** main *****/
	.maincont1 { background-color: #ffffff; height: auto; }
	.maincont1_box { height: auto; padding-top: 0; width: 100%; }
	
	/* noticeslide */
	.noticewrap {
		overflow: hidden;
		width: 100%;
	}
	.noticeslide_box {
		width: 100%;
		padding: 0;
		float: none;
		background: #fff;
		position: relative;
	}
	
	p.slideimg { width: 100%; }
	.noticeslide_box .bx-controls { display: none; }
	
	.popupzone { display: none; }

	/** maincont2 **/
	.maincont2 {
		padding-bottom: 0;
	}
	#maincont2_newcont {
		box-sizing: border-box;
		padding: 0 4px;
		width: 100%;
	}
	#maincont2_newcont:after{
		clear:both;
		display:block;
		content:"";
	}
}

@media all and (max-width:560px){
	html {
		font-size: 13px;
	}
	
	/***** main *****/
	#maincont2_right {
	    height: auto;
	    grid-template-rows: 1fr;
	}
	
	#maincont2_right .grid {
	    display: grid;
	    grid-template-columns: 1fr;
	    gap: 5px;
	}
	
	#maincont2_right a.panel {
    	padding: 30px 0;
	}
	
	#maincont2_right a.panel:nth-child(2), #maincont2_right a.panel:nth-child(3) {
		padding-top: 30px;
	}
}

@media all and (max-width:480px){	
	/***** main *****/
	.cont_slide {
	    padding-top: 50px;
	}
	
	.cont_slide p:nth-child(1) {
		font-size: 1.2rem;
	}
	.cont_slide p {
		font-size: 1.1rem;
	}
	
	.noticeslide_box, .bx-viewport, p.slideimg img {
	   height: 300px;
	}
	
	/***** sub *****/
	.title_box h3 {
		font-size: 2.3rem;
	}
	
	ul.work-process {
	    grid-template-columns: 1fr;
	    gap: 30px;
	    width: 90%;
	    margin: 30px auto;
	    font-size: 0.85rem;
	}
	
	ul.work-process li:after {
	    top: 108%;
	    transform: rotate(90deg);
	    right: 50%;
	    margin-right: -6px;
	}
	
	ul.work-process p {
		width: 70%;
		margin: 0 auto;
	}
	
	ul.steps-5 li:after {
		top: 105%;
	}
}

@media all and (max-width:360px){
	/*
	.top_wrap header h1 a{width:221px; height:85px; background-position:0 center; float:none; margin:auto; position:absolute; left:12%;}
	.tab_box{width:100%; height:9em;}
	.tabs dd ul li{height:2em;}
	.tabs dd ul li p.m_tit{font-size:0.9em; margin-top:9px;}
	.tabs dd ul li p.m_txt{display:none;}
	/* popupzone */
	/*
	.popupzone{height:280px;}
	.popupzone ul{margin-top:10px;}
	.popupzone ul li{height:242px;}
	.popupzone .bx-wrapper .bx-prev{right:66px;}
	.popupzone .bx-wrapper .bx-next {right:38px;}
	.popupzone .bx-wrapper .bx-controls-auto{right:10px;}
	.popupzone .bx-wrapper .bx-controls-direction a, .popupzone .bx-wrapper .bx-controls-auto{top:5px;}
	/** maincont2 **/
	/*
	.maincont2_box ul li a{width:100%; height:30%; padding-top:70%; font-size:0.95em; }
	/* banner pre/next */
	/*
	.banner .bx-wrapper{width:70%; height:100%;}
	/* footer */
	/*
	.add_wrap address{font-size:1em; line-height:1.2;}
	.add_wrap address span{margin:0;}
	*/
}

@media all and (max-width:320px){
	/*
	#wrap{min-width:300px;}
	*/
	/* popupzone */
	/*.popupzone{height:258px;}
	.popupzone ul{margin-top:5px;}
	.popupzone ul li{height:220px;}
	.popupzone .bx-wrapper{width:100%;}
	
	.maincont2_box ul li.info8 a, .maincont2_box ul li.info5 a{letter-spacing:-2px;}
	
	.top_wrap header h1 a{width:221px; height:85px; background-position:0 center; float:none; margin:auto; position:absolute; left:8%;}
	
	.maincont2_box ul li a{width:100%; height:30%; padding-top:70%; font-size:0.9em; }
	.banner .bx-wrapper{width:80%;}
	#footer ul li{font-size:0.9em; letter-spacing:-1px;}
	*/
}



/**** content.css ****/

@media all and (max-width:640px) {

	/***** sub *****/
	.sub_cont {
		padding: 3%; /* padding px to percent */
		width: 94%;
	}
	.cont_left {
		display: none;
	}
	.cont_right {
		float: none;
		margin-left: 0;
		min-height: 450px;
		width: 100%;
	}
	.introduce {
		font-size: 0.65em;
		padding: 2%;
	}
	
	/* history */
	dl.history_box {
		background: none;
	}
	dl.history_box dt { display: none; }
	dl.history_box dd { width: 100%; }
	.history_box dd ul li > span:first-child {
		display: inline;
		float: none;
	}
	.history_box dd ul li > span:last-child {
		display: inline;
		float: none;
		width: auto;
	}
	.tablebox {
		margin: 0;
		width: 100%;
	}
	.explain {
		padding: 0;
	}
	
	.history .history_row .col_l {
	    flex: 0 0 13rem;
	}

}


@media all and (max-width:480px){
	.explain{padding:0;}
	
	.history .history_row {
		flex-direction: column;
	}
	
	.history .history_row .col_l {
		display: none;
	}
		
	.history .history_row .col_l.title {
		display: flex;
	    flex: 0 0 1rem;
	    padding-bottom: 1rem;
	}
}


@media all and (max-width:360px){
	#map_view{height:250px;}
	.tourbox{font-size:0.65em; margin-top:5px; text-align:left;}
	.apibtn{background:#04adbf; padding:5px 12px;}
	.h4_box{padding: 15px 0 5px;}
	
	/* regulation */
	a.regbtn{float:none; display:block; margin-top:0; width:50px; position:relative; left:10px;}
	
	.roundlist li a{display:block; width:69%; padding:3% 0 3% 30%; text-align:center; font-size:0.65em;}
	.ml25{margin-left: 0 !important;}
	
	.disk-out.pt10.pl40.li_mb10{padding-left:20px !important;}
	ul.decimal-out.pt10.pl40.li_mb10{padding-left:20px !important;}
	ul.decimal-out.pt20.pl40.li_mb10{padding-left:20px !important;}
	ul.decimal-out.pl25.li_mb25{padding-left:20px !important;}
	ul.decimal-out.pl25.li_mb10.mb50{padding-left:20px !important;}
	ul.decimal-out.pl25.li_mb20{padding-left:20px !important;}
	ul.decimal-out.pl25.li_mb10{padding-left:20px !important;}
	
	.h5_box.mt5 > ul.decimal-out.ml50.mt5.li_mb5{margin-left:20px !important;}
	
	ul.disk-out.ml40.pt10.pb10{margin-left:0 !important;}
	ul.disk-out.ml40.pt10.li_mb10{margin-left:0 !important;}
	ul.disk-out.ml30.pt10{margin-left:0 !important;}
	
	
	.pl25{padding-left: 0 !important;}
	.pl50{padding-left:25px !important;}
	.pl30{padding-left: 0 !important;}
	.linebox.ml25.mr25.mt15{margin-right:0 !important;}
	.linebox.ml25.mr25.mt15 ul.decimal-out.ml25.li_mb5{padding-left:20px !important;}
	.linebox.ml30.mr30.mt10.center{margin-right:0 !important; margin-left: 0 !important;}
	.explain > div.decimal-out.pl10.li_mb20 ul{padding-left:10px !important;}
	
	input[type=text]{width:50%;}
}