@charset "utf-8";

@media (max-width: 1500px) {
	#gnb>ul {margin-right:160px;} 
	#gnb>ul>li {padding:0 20px;}


	.section5 .original li {margin-top:40px;}
	.section5 .original li:hover {margin-top:40px;}
	.section5 .original li:hover .over {opacity:1;}
	.section5 .original li .over {opacity:0; width:100%; height:100%;}
	.section5 .original li .over h3 {font-size:26px; margin-bottom:16px;}
	.section5 .original li .over p {font-size:18px; padding:0 5px;}
	.section5 .original li .over p br {display:none;}	

	.section3 .button-prev {left:15px;}
	.section3 .button-next {right:15px;}

}

@media (max-width: 1230px) {
	#gnb>ul {margin-right:100px;}
	#gnb>ul>li {padding:0 10px;}
	.contact a {font-size:16px; padding:8px;}

	.detail-wrap {flex-direction:column; max-width:660px !important;}
	.detail-img {width:100%; padding-right:0;}
	.detail-txt {width:100%; padding:40px;}	
}


/* Landscape tablet */
@media (max-width: 1024px) {
	body, input, textarea, select, button, table {font-size:15px;}	
	/* header */
	#header {height:80px;}
	#header .sitelogo a {width:230px;}
	#gnb {display:none;}
	.contact {right:auto; left:260px;}
	.contact a {font-size:15px; padding:5px;}
	.btn-m-menu {display:block;}
	
	/*layout*/
	/* main */
	.section-common {padding-top:80px;}

	.section1 .txt {padding:40px 20px; width:80%;}
	.section1 .txt .tt1 {font-size:40px;} 
	.section1 .txt .tt2 {width:400px; margin:0 auto 18px;}
	.section1 .txt .tt3 {font-size:30px;}

	.section2 .wrap {padding:80px 0;}
	.section2 .wrap .img-box {margin-bottom:26px;}
	.section2 .wrap p {font-size:24px;}
	.section2 .wrap p span {font-size:20px;}


	.section3 .wrap {padding:50px 0;}
	.section3 .tit {margin-bottom:24px; text-align:center; }
	.section3 .tit img.tit01 {width:280px; display:block; margin:0 auto 10px;}
	.section3 .tit img.tit02 {width:380px; display:block; margin:0 auto;}
	.section3 .txt h3 {font-size:28px; margin-bottom:10px;}
	.section3 .txt p {font-size:22px;}
	.section3 .swiper-container {margin:0 auto 30px;}
	.section3 .swiper-slide {width:580px; height:350px;}

	.section3 .button-arrow {width:50px; height:19px;}


	.section4 .wrap {padding:50px 0;}
	.section4 .tit {font-size:40px; margin-bottom:40px;}
	.section4 .col:nth-child(2) .txt {padding-left:30px;}
	.section4 .col h3 {font-size:26px; padding-left:36px; margin-bottom:15px;}
	.section4 .col p {font-size:20px; padding:0 10px;}
	.section4 .col p br {display:none;}
	.section4 .col h3:before {width:28px; height:28px;}

	.section5 .wrap {padding:50px 0;}
	.section5 .tit {font-size:40px; margin-bottom:30px;}
	.section5 .original {margin-bottom:60px;}
	.section5 .original ul {flex-wrap:wrap; margin-left:-15px; margin-bottom:-15px;}
	.section5 .original li {width:calc(50% - 15px); margin-left:15px; margin-bottom:15px; margin-top:0; display:flex; flex-direction:column; text-align:center;}
	.section5 .original li:hover {margin-top:0;}
	.section5 .original li .over {opacity:1; width:100%; height:100%; position:static; margin-top:30px; padding:30px;}
	.section5 .original li .over h3 {font-size:26px; margin-bottom:16px;}
	.section5 .original li .over p {font-size:18px; padding:0;}
	.section5 .original li .over p br {display:none;}
	.section5 .cnt h3 {font-size:34px; margin-bottom:50px;}
	.section5 .cnt h3:before {width:60px; height:49px; margin-right:12px;}

	.section6 .tit {font-size:40px; margin-bottom:30px;}
	.section6 .wrap {padding:50px 0;}
	.section6 .wrap ul {margin-bottom:-30px;}
	.section6 .wrap li {width:33.33333%; margin-bottom:30px;}
	.section6 .wrap .img-box {margin-bottom:20px;}
	.section6 .wrap .tt span {font-size:18px;}
	.section6 .wrap .tt p {font-size:22px;}
	.section6 .wrap .tt p strong.c_fcff00 {margin-right:5px; font-size:20px;}

	.section7 .wrap {padding:50px 0;}
	.section7 .tit {font-size:40px; margin-bottom:40px;}
	.section7 .box {width:50%;}
	.section7 .exterior {padding-right:10px;}
	.section7 .interior {padding-left:10px;}
	.section7 h3 {font-size:22px; margin-bottom:25px;}
	.section7 .items {padding-bottom:33px;}
	.section7 .slick-dots li button {width:35px;}

	.section8 .wrap {padding:50px 0;}
	.section8 .tit {font-size:40px; margin-bottom:40px;}
	.section8 ol {margin-left:-30px; margin-bottom:-30px;}
	.section8 li {width:calc(33.333333% - 30px); margin-left:30px; margin-bottom:30px;}
	.section8 li h3 {font-size:24px; line-height:59px;}
	.section8 li h3:before {width:24px; height:24px; margin-top:-5px; margin-right:8px;}
	.section8 li p {font-size:18px; padding:30px 10px;}

	.section9 .wrap {padding:50px 0;}
	.section9 .tit {font-size:40px; margin-bottom:40px;}
	.section9 .tit span {font-size:24px; margin-top:10px;}
	.section9 .table {padding-right:10px;}
	.section9 .table p {font-size:16px;}
	.section9 table {line-height:1.5em;}
	.section9 table th {font-size:22px; padding:10px 0;}
	.section9 table td {font-size:20px;}
	.section9 .img-box {padding-left:5px;}

	.section10 .wrap {padding:0 0 50px;}
	.section10 .tit {font-size:40px; margin-bottom:30px;}
	.section10 .tit span {font-size:24px;}
	.section10 ul {margin-bottom:-15px;}
	.section10 li {width:33.33333%; margin-bottom:15px;}
	.section10 li .txt {font-size:24px;}
	.section10 li .txt span {font-size:16px;}

	.section11 .wrap {padding:50px 0;}
	.section11 .tit {font-size:40px; margin-bottom:40px;}
	.inquiry-wrap {flex-direction:column;}
	.inquiry-wrap .form-agree {width:100%; margin-bottom:30px;}
	.inquiry-wrap .partner {width:100%; padding-left:0}

	.foot-group {padding:20px 0;}
	.foot-group ul {display:flex; margin-left:-15px;}
	.foot-group ul li {margin-left:15px;}
	.foot-group ul li a {padding-left:25px;}
	.foot-info {padding:20px 0;}
	.foot-info address p {font-size:13px;}
	.foot-info address p strong {font-size:15px;}
	.foot-info address p span {margin:0 5px;}
	.foot-info address p:first-child {margin-bottom:8px;}
	
	
	.detail-txt h3 {font-size:24px; margin-bottom:20px; padding-bottom:15px;}
	.detail-txt h3:after {width:40px;}
	.detail-txt p {font-size:18px;}


} 



/* portrait tablet */
@media (max-width: 900px) {	
	.section4 .col:nth-child(2) .txt {padding-left:20px;}
	.section4 .col h3:before {top:3px;}
	.section4 .col h3 {font-size:22px; padding-left:24px; margin-bottom:10px;}
	.section4 .col p {font-size:18px;}
	.section4 .col p br {display:none;}
	.section4 .col h3:before {width:20px; height:20px;}
} 

/* Landscape phone */
@media (max-width: 640px) {
	body, input, textarea, select, button, table {font-size:14px;}
	.only-desktop-tablet {display:none;}
	.only-tablet {display:none;}
	.only-mobile {display:block;}

	/* header */
	#header {height:60px;}
	#header .sitelogo a {width:160px;}	
	.btn-m-menu {top:21px;}
	.contact {left:190px;}
	.contact a {font-size:14px;}
	/*layout*/
	/* main */
	.section-common {padding-top:30px;}

	.section1 .txt {padding:30px 15px; width:90%;}
	.section1 .txt .tt1 {font-size:28px;} 
	.section1 .txt .tt2 {width:250px; margin:0 auto 10px;}
	.section1 .txt .tt3 {font-size:22px;}

	.section2 .wrap {padding:30px 0; flex-direction:column; margin-bottom:-20px;}
	.section2 .wrap .box {width:100%; text-align:center; margin-bottom:20px;}
	.section2 .wrap .img-box {margin-bottom:10px; width:260px;}
	.section2 .wrap p {font-size:20px;}
	.section2 .wrap p span {font-size:16px;}

	.section3 .wrap {padding:30px 0;}
	.section3 .tit {margin-bottom:10px;}
	.section3 .tit img.tit01 {width:230px;}
	.section3 .tit img.tit02 {width:280px;}
	.section3 .txt h3 {font-size:22px;}
	.section3 .txt p {font-size:18px; padding:0 30px;}
	.section3 .txt p br {display:none;}
	.section3 .swiper-container {margin:0 auto 20px;}
	.section3 .swiper-slide {width:380px; height:250px;}
	.section3 .button-arrow {width:44px; height:16px;}

	.section4 .wrap {padding:30px 0;}
	.section4 .tit {font-size:24px; margin-bottom:20px;}

	.section4 .col {flex-direction: column;}
	.section4 .col:nth-child(2) {flex-direction: column;}
	.section4 .col:nth-child(2) .txt {padding:15px;}
	.section4 .col h3:before {top:3px;}
	.section4 .col h3 {font-size:18px; padding-left:22px;}
	.section4 .col p {font-size:16px; transform:skew(-0.1deg)}
	.section4 .col p br {display:none;}
	.section4 .col h3:before {width:16px; height:16px;}
	.section4 .col .img-box {width:100%;}
	.section4 .col .txt {width:100%; padding:15px;}




	.section5 .wrap {padding:30px 0;}
	.section5 .tit {font-size:24px; margin-bottom:20px;}
	.section5 .original {margin-bottom:30px;}
	.section5 .original li .over {margin-top:20px; padding:20px;}
	.section5 .original li .over h3 {font-size:22px; margin-bottom:10px;}
	.section5 .original li .over p {font-size:16px;}
	.section5 .cnt h3 {font-size:22px; margin-bottom:30px;}
	.section5 .cnt h3:before {width:50px; height:41px; margin-right:8px;}
	.section5 .cnt ul {flex-direction:column; margin-bottom:-15px;}
	.section5 .cnt li {width:100%; margin-bottom:15px;}
	.section5 .cnt li .img-box {width:270px; margin:0 auto;}

	.section6 .tit {font-size:24px; margin-bottom:20px;}
	.section6 .wrap {padding:30px 0;}
	.section6 .wrap ul {margin-bottom:-20px;}
	.section6 .wrap li {width:50%; margin-bottom:20px;}
	.section6 .wrap .img-box {margin-bottom:12px;}
	.section6 .wrap .tt span {font-size:15px;}
	.section6 .wrap .tt p {font-size:19px;}
	.section6 .wrap .tt p strong.c_fcff00 {font-size:17px;}

	.section7 .wrap {padding:30px 0;}
	.section7 .tit {font-size:24px; margin-bottom:25px;}
	.section7 .cnt {flex-direction:column;}
	.section7 .box {width:100%;}
	.section7 .exterior {padding-right:0; margin-bottom:20px;}
	.section7 .interior {padding-left:0;}
	.section7 h3 {font-size:18px; margin-bottom:20px;}
	.section7 .items {padding-bottom:20px;}
	.section7 .slick-dots li button {width:30px;}



	.section8 .wrap {padding:30px 0;}
	.section8 .tit {font-size:24px; margin-bottom:25px;}
	.section8 ol {margin-left:-15px; margin-bottom:-20px;}
	.section8 li {width:calc(50% - 15px); margin-left:15px; margin-bottom:20px;}
	.section8 li h3 {font-size:20px; line-height:1.5em; padding:10px 0;}
	.section8 li h3:before {width:20px; height:20px;}
	.section8 li p {font-size:16px; padding:20px 10px;}



	.section9 .wrap {padding:50px 0;}
	.section9 .tit {font-size:24px; margin-bottom:25px;}
	.section9 .tit span {font-size:18px;}
	.section9 .cnt {flex-direction: column;}
	.section9 .table {padding-right:0; width:100%; margin-bottom:20px;}
	.section9 .table p {font-size:14px;}
	.section9 table th {font-size:18px; padding:10px 0;}
	.section9 table td {font-size:14px;}
	.section9 .img-box {padding-left:0; width:100%;}


	.section10 .wrap {padding:0 0 30px;}
	.section10 .tit {font-size:24px; margin-bottom:20px;}
	.section10 .tit span {font-size:18px;}
	.section10 li {width:50%;}
	.section10 li .txt {font-size:18px;}
	.section10 li .txt span {font-size:14px;}


	.section11 .wrap {padding:30px 0;}
	.section11 .tit {font-size:24px; margin-bottom:25px;}
	.inquiry-wrap .form-agree {margin-bottom:20px;}
	.inquiry-wrap .partner .inner p {font-size:14px;}


	.foot-group {padding:15px 0; flex-direction:column;}
	.foot-group .foot-logo {width:150px; margin-bottom:15px;}
	.foot-group ul {margin-left:-15px;}
	.foot-group ul li {margin-left:15px;}
	.foot-group ul li a {padding-left:25px;}
	.foot-group ul li a:before {top:6px;}

	.foot-info {padding:15px 0; text-align:center;}
	.foot-info address p {font-size:12px;}
	.foot-info address p strong {font-size:14px;}
	.foot-info address p span {display:none;}
	.foot-info address p:first-child {margin-bottom:8px;}
	.foot-info address p br {display:block;}


	.detail-wrap {max-width:400px !important;}
	.detail-txt {padding:20px;}
	.detail-txt h3 {font-size:20px; margin-bottom:10px; padding-bottom:10px;}
	.detail-txt h3:after {width:30px;}
	.detail-txt p {font-size:16px; transform:skew(-0.1deg)}
	

	.board-form table tbody {display:block;}
	.board-form table tr {display:block; padding:12px 0;}
	.board-form table th {display:block; border:0; text-align:left; padding:0; margin-bottom:7px; font-size:16px; background:none;}
	.board-form table td {display:block; border:0; padding:0;}
	.board-form + .buttons {margin-top:30px;}

} 
/* Landscape phones and down */
@media (max-width: 400px) {
	.section5 .original li {width:100%;}
	.section8 li {width:100%;}	
	.section6 .wrap .tt p {font-size:17px;}
	.detail-wrap {max-width:300px !important;}
}
