@charset "utf-8";

@media (max-width: 1900px) {
	/* .main-visual {height: 930px;}
	.main-visual .item {height: 930px;}
	.main-visual .item .img-box {height: 930px;} */

	/* section02 */
	.sec02 .origin {max-width: 1000px;}
	.sec02 .thumb {padding: 0 100px 0 110px;}

	/* footer */
	.scroll-top {right:15px; bottom:120px; width: 55px; height: 55px;}
}

@media (max-width: 1800px) {
	/* .main-visual {height: 860px;}
	.main-visual .item {height: 860px;}
	.main-visual .item .img-box {height: 860px;} */
	.main-visual .controler-wrap {left: 15px;}
	.main-visual .scroll-down {right: 20px;}

	/* section02 */
	.sec02 .origin {max-width: 950px;}
	.sec02 .thumb {padding: 0 60px 0 80px;}
}

@media (max-width: 1600px) {
	/* header */
	#gnb>ul>li {padding:0 35px;}

	/* .main-visual {height: 760px;}
	.main-visual .item {height: 760px;}
	.main-visual .item .img-box {height: 760px;} */
	.main-visual .item .text-box {margin: 20px auto 0;}
	/* section02 */
	.sec02 .origin {max-width: 820px;}
	.sec02 .thumb {padding: 0 30px 0 60px;}
}

@media (max-width: 1400px) {
	/* header */
	#gnb>ul>li {padding:0 20px;}
	#gnb>ul>li>a {font-size: 18px;}
	#gnb .submenu {width:200px;}

	/* main */
	/* .main-visual {height: 660px;}
	.main-visual .item {height: 660px;}
	.main-visual .item .img-box {height: 660px;} */
	.main-visual .item .text-box small {font-size: 16px; margin-bottom: 10px;}
	.main-visual .item .text-box h2 {font-size: 65px; margin-bottom: 6px;}
	.main-visual .item .text-box p {font-size: 40px; margin-bottom: 55px;}
	.main-visual .controler-wrap {bottom: 40px;}

	/* section02 */
	.sec02 .origin {max-width: 700px;}
	.sec02 .thumb {padding: 0 15px 0 50px;}

	/* section04 */
	.sec04 .left-box {padding-left: 0;}
	.sec04 .right-box {padding-right: 0;}
}

@media (max-width: 1200px) {
	/* header */
	#header .sitelogo a {background-size: 186px auto;}
	#gnb>ul>li {padding:0 15px;}
	#gnb>ul>li>a {font-size:16px;}
	#gnb .submenu {width:180px;}
	#gnb .submenu ul {padding: 30px 0 50px;}
	#gnb .submenu ul li a {font-size: 16px;}

	.lang-selector {right: 60px;}

	/* main */
	/* .main-visual {height: 600px;}
	.main-visual .item {height: 600px;}
	.main-visual .item .img-box {height: 600px;} */
	.main-visual .item .text-box small {font-size: 15px; margin-bottom: 10px;}
	.main-visual .item .text-box h2 {font-size: 55px; margin-bottom: 6px;}
	.main-visual .item .text-box p {font-size: 35px; margin-bottom: 40px;}

	/* section02 */
	.sec02 .origin {max-width: 600px;}
	.sec02 .thumb {padding: 0 15px 0 40px;}

	/* section03 */
	.sec03 .item .text-box {padding: 30px 40px 40px;}
}

@media (max-width: 1024px) {
	#wrapper {overflow: hidden;}
	/* header */
	#header {height:80px;}
	#header.hide {transform:translateY(0);}
	#header .sitelogo a {background-size: 170px auto;}
	#gnb {display:none;}
	.lang-selector {right: 60px;}

	/* main */
	.main-visual .item .text-box {margin: 10px auto 0;}
	.main-visual .item .text-box small {font-size: 15px; margin-bottom: 10px;}
	.main-visual .item .text-box h2 {font-size: 55px; margin-bottom: 6px;}
	.main-visual .item .text-box p {font-size: 35px; margin-bottom: 50px;}
	.main-visual .item .text-box a {width: 170px; height: 55px; font-size: 14px; line-height: 55px; padding-right: 20px;}
	.main-visual .item .text-box a:after {right: 25px;}
	.main-visual .item .text-box a:hover:after {right: 20px;}

	.sec-title-wrap {display: block; margin-bottom: 50px;}
	.sec-title h3 {font-size: 52px; margin-bottom: 15px;}
	.sec-title p {font-size: 20px;}
	.sec-title.white h3 {font-size: 42px; margin-bottom: 15px;}
	.sec-title-wrap .btn-area {text-align: right; margin-top: 10px;}
	.sec-title-wrap .btn-area a {width: 170px; height: 55px; font-size: 14px; line-height: 55px; padding-right: 20px; margin-bottom: 0;}
	.sec-title-wrap .btn-area a:after {right: 25px;}
	.sec-title-wrap .btn-area a:hover:after {right: 20px;}

	/* section01 */
	.sec01 {padding-top: 100px;}
	.sec01 .sec-title {margin-bottom: 50px;}
	.sec01 .items {margin: -10px;}
	.sec01 .item {padding: 10px;}
	.sec01 .item .inner {width: 350px; min-height: 450px; padding: 45px 35px;}
	.sec01 .item-product .text-box h4 {font-size: 34px;}
	.sec01 .item-product .text-box p {margin-bottom: -20px; font-size: 18px; margin-top: 50px; padding-top: 25px;}
	.sec01 .item-product .inner:hover .text-box p {margin-top: 25px; transition-delay:.2s;}
	.sec01 .item-product .btn-area {bottom: 10px; right: 35px;}
	.sec01 .item-product .inner:hover .btn-area {bottom: 40px;}
	.sec01 .item-product .btn-area a {margin-top: 10px; font-size: 16px;}
	.sec01 .item-product .btn-area a span {margin-left: 15px;}
	.sec01 .item-product .btn-more {width: 50px; height: 50px;}

	.sec01 .item-search .inner {padding: 120px 20px 0;}
	.sec01 .item-search .inner:hover {padding-top: 25px;}
	.sec01 .item-search .text-box h4 {font-size: 32px;}
	.sec01 .item-search .text-box p {font-size: 18px; padding: 0 10px; margin-top: 14px;}
	.sec01 .item-search .btn-area {bottom: 160px; margin-left: -80px;}
	.sec01 .item-search .btn-search {width: 170px; height: 56px; font-size: 16px; line-height: 56px; padding-left: 30px;}
	.sec01 .item-search .btn-search:before {left: 38px;}

	/* section02 */
	.sec02 {padding-top: 110px;}
	.sec02 .sec-title-wrap {margin: 0 auto 50px;}
	.sec02 .cont-wrap {display: block;}
	.sec02 .origin {max-width: none;}
	.sec02 .img-box {width: 100%; height: 400px;}
	.sec02 .thumb {width: 100%; flex: auto; padding: 50px 15px;}
	.sec02 .thumb h4 {font-size: 34px; padding-bottom: 20px; margin-bottom: 25px;}
	.sec02 .thumb p {min-height: auto; font-size: 18px; margin-bottom: 10px;}
	.sec02 .paging ul {margin: -10px;}
	.sec02 .paging ul li {padding: 10px;}
	.sec02 .paging ul li button {font-size: 16px; line-height: 50px;}

	/* section03 */
	.sec03 {padding: 110px 0 120px;}
	.sec03 .items {margin: 0 -10px;}
	.sec03 .item {padding: 0 10px;}
	.sec03 .item .text-box {padding: 25px 25px 30px;}
	.sec03 .item .title p {font-size: 22px; margin-bottom: 25px;}

	/* section04 */
	.sec04 {height: 720px;}
	.sec04 .sec-title {margin-bottom: 45px;}
	.sec04 .cont {min-height: 245px; padding: 0 10px;}
	.sec04 .left-box .icon {width: 160px; height: 160px;}
	.sec04 .right-box dl {max-width: 450px; margin: 0 auto 10px;} 
	.sec04 .right-box dt {max-width: 120px; height: 42px; font-size: 15px; line-height: 42px; margin-right: 15px;}
	.sec04 .right-box dd {font-size: 18px; padding-top: 8px;}

	.sec04 .btn-area a {width: 220px; height: 64px; font-size: 16px; line-height: 60px; padding-left: 24px; margin: 25px auto 0;}
	.sec04 .btn-area a:before {margin-top: -8px;}
	.sec04 .left-box .btn-area a:before {left: 38px;}
	.sec04 .right-box .btn-area a:before {left: 55px;}
	
	/* footer */
	#footer {padding: 50px 0;}
	.footer-top {padding-bottom: 20px; margin-bottom: 25px;}
	.footer-top .wrap {justify-content: flex-end;}
	.footer-gnb {display: none;}
	.copyright p {margin-top: 10px;}

	.scroll-top {width: 45px; height: 45px;}
}

@media (max-width: 768px) {
	/* header */
	#header {height:60px;}
	#header .sitelogo a {background-size: 150px auto;}
	.lang-selector {right: 60px;}
	.lang-btn {width: 70px; height: 34px;}
	.lang-btn:after {right: 9px;}

	/* main */
	.main-visual {height: 100vh;}
	.main-visual .item {height: 100vh;}
	.main-visual .item .img-box {height: 100%;}
	.main-visual .item .text-box {margin: 0 auto 0;}
	.main-visual .item .text-box small {font-size: 15px; margin-bottom: 10px;}
	.main-visual .item .text-box h2 {font-size: 45px; margin-bottom: 6px;}
	.main-visual .item .text-box p {font-size: 26px; margin-bottom: 30px;}
	.main-visual .item .text-box a {width: 160px; height: 50px; font-size: 14px; line-height: 50px; padding-right: 20px;}
	.main-visual .controler-wrap {bottom: 60px;}

	.sec-title-wrap {margin-bottom: 40px;}
	.sec-title h3 {font-size: 42px; margin-bottom: 15px;}
	.sec-title p {font-size: 18px;}
	.sec-title.white h3 {font-size: 35px; margin-bottom: 15px;}
	.sec-title-wrap .btn-area a {width: 150px; height: 46px; font-size: 13px; line-height: 46px; padding-right: 20px;}
	.sec-title-wrap .btn-area a:after {right: 20px;}

	/* section01 */
	.sec01 {padding-top: 70px;}
	.sec01 .sec-title {margin-bottom: 40px;}
	.sec01 .items {margin: -5px;}
	.sec01 .item {padding: 5px;}
	.sec01 .item .inner {width: 330px; min-height: 380px; padding: 35px 25px;}
	.sec01 .item-product .inner:before {opacity: 0.85; bottom: 0;}
	.sec01 .item-product .text-box h4 {font-size: 26px;}
	.sec01 .item-product .text-box p {opacity: 0.6; margin-bottom: -20px; font-size: 16px; margin-top: 15px; padding-top: 15px;}
	.sec01 .item-product .inner:hover .text-box p {margin-top: 15px;}
	.sec01 .item-product .btn-area {bottom: 30px; right: 25px;}
	.sec01 .item-product .inner:hover .btn-area {bottom: 30px;}
	.sec01 .item-product .btn-area > * {opacity: 1;}
	.sec01 .item-product .btn-area a {margin-top: 8px; font-size: 15px;}
	.sec01 .item-product .btn-area a span {margin-left: 15px;}
	.sec01 .item-product .btn-more {width: 45px; height: 45px;}

	.sec01 .item-search .inner {padding: 60px 20px 0;}
	.sec01 .item-search .inner:hover {padding-top: 60px;}
	.sec01 .item-search .text-box h4 {font-size: 26px;}
	.sec01 .item-search .text-box p {height: 100%; opacity: 0.6; font-size: 16px; padding: 0 15px; margin-top: 14px;}
	.sec01 .item-search .btn-area {bottom: 90px; margin-left: -80px;}
	.sec01 .item-search .btn-search {width: 150px; height: 50px; font-size: 15px; line-height: 50px; padding-left: 27px;}
	.sec01 .item-search .btn-search:before {left: 34px;}

	/* section02 */
	.sec02 {padding-top: 70px;}
	.sec02 .sec-title-wrap {margin: 0 auto 40px;}
	.sec02 .img-box {height: 300px;}
	.sec02 .thumb {flex-direction: column-reverse; padding: 30px 15px;}
	.sec02 .thumb h4 {font-size: 24px; padding-bottom: 10px; margin-bottom: 15px;}
	.sec02 .thumb p {font-size: 16px; margin-bottom: 0;}
	.sec02 .paging {margin-bottom: 25px;}
	.sec02 .paging ul {margin: -5px;}
	.sec02 .paging ul li {width: 33.3333%; padding: 5px;}
	.sec02 .paging ul li button {width: 100%; height: 100%; font-size: 15px; line-height: 1.3em; padding: 3px;}

	/* section03 */
	.sec03 {padding: 70px 0 80px;}
	.sec03 .items {margin: 0 -5px;}
	.sec03 .item {padding: 0 5px;}
	.sec03 .item .text-box {padding: 25px 20px 30px;}
	.sec03 .item .title p {font-size: 20px; margin-bottom: 20px;}
	.sec03 .item .date p {font-size: 15px; padding-left: 23px;}
	.sec03 .item .date p:before {margin-top: -16px; left: 0;}

	/* section04 */
	.sec04 {height: auto; padding: 80px 0;}
	.sec04:before {top: 465px; left: 0; width: 100%; height: 1px;}
	.sec04 .container {height: auto;}
	.sec04 .wrap {flex-wrap: wrap; height:  auto;}
	.sec04 .wrap > div {width: 100%;}
	.sec04 .wrap .left-box {margin-bottom: 70px;}
	.sec04 .sec-title {margin-bottom: 35px;}
	.sec04 .cont {min-height: auto; padding: 0;}
	.sec04 .left-box .icon {width: 140px; height: 140px;}
	.sec04 .right-box dl {max-width: none; margin: 0 auto 10px;} 
	.sec04 .right-box dt {max-width: 110px; height: 40px; font-size: 15px; line-height: 40px; margin-right: 13px;}
	.sec04 .right-box dd {font-size: 16px; padding-top: 10px;}
	.sec04 .btn-area a {width: 200px; height: 60px; font-size: 15px; line-height: 56px; padding-left: 22px; margin: 30px auto 0;}
	.sec04 .btn-area a:before {margin-top: -8px;}
	.sec04 .left-box .btn-area a:before {left: 32px;}
	.sec04 .right-box .btn-area a:before {left: 49px;}

	/* footer */
	#footer {padding: 40px 0 50px;}
	.footer-top {padding-bottom: 20px; margin-bottom: 25px;}
	.footer-top .wrap {justify-content: center;}
	.copyright p {font-size: 15px; margin-top: 20px; text-align: center;}

	.footer-bottom {display: block; text-align: center;}
	.footer-logo {margin-bottom: 15px;}
	.footer-logo img {width: 140px;}
	.footer-bottom ul {flex-wrap: wrap; justify-content: center; margin: -3px -12px;}
	.footer-bottom ul li {padding: 3px 12px;}
	.footer-bottom ul li a {font-size: 15px;}
	.footer-bottom ul li a.sns_insta {padding-left: 25px;}
	.footer-bottom ul li a.sns_insta:before {background-size: 18px auto;}
}

@media (max-width: 480px) {
	/* main */
	.main-visual .item .text-box h2 {font-size: 36px; margin-bottom: 6px;}
	.main-visual .item .text-box p {font-size: 22px; margin-bottom: 30px;}

	.sec-title h3 {font-size: 32px; margin-bottom: 12px;}
	.sec-title p {font-size: 18px;}
	.sec-title.white h3 {font-size: 28px; margin-bottom: 12px;}

	.sec04:before {top: 455px;}
}