@charset "utf-8";

@media (max-width: 1400px) {
	.product .wrap {display:block;}
	.product .cnt {width:100%; padding-left:0;}
	.product .menu {position:absolute; left:0; top:30px; padding:30px 15px; transform:translateX(-100%); transition:all 0.4s; z-index:10; border:1px solid #ddd; background:#fff; box-shadow:0 0 10px rgba(21,21,21,0.3);}
	.product .menu.menu-active {transform:translateX(0);}
	.product .menu-open {position:absolute; top:40px; right:-40px; width:40px; height:40px; background-color:#518bd3;}
	.product .menu-open:after {content:''; width:30px; height:30px; top:50%; left:50%; margin-top:-15px; margin-left:-15px; background-repeat:no-repeat; background-position:center center; background-size:cover; background-image:url('../img/sub/menu-open.png'); transition:all 0.4s; position:absolute;}
	.product .menu.menu-active .menu-open:after {transform:rotate(180deg);}
	.product .menu .inner {height:400px; overflow-y:scroll;}
	.product .menu .inner>ul {padding-right:10px;}
	.product .menu .inner>ul>li:first-child {border-top:1px solid #ddd;}
	.product .menu .inner>ul>li>a {font-size:18px; padding:15px;}	
	.product .menu .depth {padding:15px;}
	
		/*
	.product .list {width:100%; padding-left:0;}
	.product .list .title {padding-bottom:60px;}
	*/
}

@media (max-width: 1024px) {
	/* sub-visual */
	.sub-visual {height:360px;}
	.sub-visual .title p {font-size:18px; letter-spacing:.4em; margin-bottom:12px;}
	.sub-visual .title h2 {font-size:40px;}
	/* lnb */
	.lnb ul li a {font-size:18px; padding:16px 10px;}
	/* common */
	.real-cont {padding:80px 0 120px;}

	.doc-tit {padding-top:0; margin-bottom:44px;}
	.doc-tit h3 {font-size:36px;}
	/* sub 01 01 */
	.introduce .txt-box {margin-bottom:44px;}
	.introduce .txt-box h4 {font-size:26px; margin-bottom:20px;}
	.introduce .txt-box p {font-size:16px;}
	.introduce .txt-box p br {display:none;}
	.introduce .col dt {max-width:100px; font-size:16px; padding:12px 15px;}
	.introduce .col dd {font-size:16px; padding:12px 15px;}
	/* sub 01 02 */
	.history .img-box {margin-bottom:80px;}
	.history .col {display:block; padding-bottom:100px;}
	.history .col:after {height:calc(100% - 20px); top:20px; left:0;}
	.history .year {display:none;}
	.history .wrap {width:100%; padding-left:30px;}
	.history .txt-box {margin-bottom:80px;}
	.history .txt-box:before {top:17px; left:-34px;}
	.history .txt-box .m-year {display:block; font-size:40px; line-height:1.1em; color:#518bd3; font-weight:600; margin-bottom:40px;}
	.history .txt-box .txt .month {max-width:40px; font-size:16px;}
	.history .txt-box .txt p {font-size:16px;}
	/* sub 01 03 */
	.directions .maps {margin-bottom:36px;}
	.directions .maps .root_daum_roughmap {height:350px !important;}
	.directions .maps .root_daum_roughmap .wrap_map {height:350px !important;}
	.directions .txt-box {padding-right:0;}
	.directions .txt-box .btn {position:relative; margin-bottom:20px;}
	.directions .txt-box .btn ul {justify-content:flex-end;}
	.directions .txt-box .btn ul li a {font-size:16px; width:180px; line-height:60px; padding:0 20px;}
	.directions .txt-box .btn ul li a:before {display:none;}
	.directions .txt-box .btn ul li a:hover strong {color:#666;}
	.directions .txt-box .btn ul li a span {width:32px; height:32px; margin-top:-16px; right:18px;}
	.directions .txt-box .btn ul li a span:before {width:10px; height:2px; margin-top:-1px; margin-left:-5px;}
	.directions .txt-box dl {font-size:16px;}
	.directions .txt-box dt {max-width:50px;}
	/* sub 02 list */
	.product .wrap {display:block;}
	.product .cnt {width:100%; padding-left:0;}
	.product .menu .inner>ul>li>a {font-size:16px; padding:10px;}
	.product .menu .inner>ul>li>a:after {width:20px; height:20px; right:10px; margin-top:-10px;}
	.product .menu .depth {padding:15px 10px;}
	.product .menu .depth li {margin-bottom:2px;}
	.product .menu .depth li a {font-size:16px;}
	.product .list .title {display:block;}
	.product .list .title h3 {font-size:28px; margin-bottom:30px;}
	.product .list .title .search {justify-content:flex-end; margin-bottom:0;}
	.product .list .title .select-box {margin-right:20px;}
	.product .list .title .select-box select {height:36px;}
	.product .list .title .select-box button {height:36px; font-size:15px;}
	.product .list .title .input-box {max-width:200px;}
	.product .list .title .input-box input { line-height:34px; font-size:15px;}
	.product .list .title .input-box input::placeholder {font-size:15px;}
	.product .list .title .input-box button {width:34px; height:34px;}
	.product .list .col {margin-left:-20px;}
	.product .list .col .row {width:calc(25% - 20px); margin-left:20px; margin-bottom:40px;}
	.product .list .inner .img-box {margin-bottom:10px;}
	.product .list .inner .txt-box h4 {font-size:16px;}
	.product .list .inner .txt-box p {font-size:14px;}
	/* sub 02 view */
	.product .view .title {margin-bottom:40px;}
	.product .view .title h3 {font-size:28px;}
	.product .view .col {display:block; margin-bottom:60px;}
	.product .view .col .img-box {margin:0 auto 60px;}
	.product .view .col .txt-box {width:100%; padding-left:0;}
	.product .view .col .img-box .orgin {margin-bottom:20px;}
	.product .view .col .img-box .thumb .items {margin:0 -10px;}
	.product .view .col .img-box .thumb .item {padding:0 10px;}
	.product .view .col .txt-box .tit h4 {font-size:26px;}
	.product .view .col .txt-box .txt {padding-top:20px; margin-top:20px;}
	.product .view .col .txt-box .txt h5 {font-size:20px;}
	.product .view .col .txt-box .txt p {font-size:16px;}
	.product .view .tab-cnt {padding-bottom:50px;}
	.product .view .tab-menu {margin-bottom:40px;}
	.product .view .tab-menu ul li a {font-size:16px; padding:14px 10px;}
	.product .view .text-box .txt {margin-bottom:50px;}
	.product .view .text-box .txt p {font-size:16px;}
	.product .view .down {border-top:1px solid #ddd; border-left:1px solid #ddd; border-bottom:0; border-right:0;}
	.product .view .down .row {padding:40px 15px; width:33.333333%; border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
	.product .view .down .row:last-child {border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
	.product .view .down .row p {font-size:16px; margin-bottom:10px;}
	.product .view .down .row a {width:120px; font-size:13px; line-height:32px; padding:0 10px;}
	.product .view .down .row a:after {right:10px;}
	.product .view .related {margin-left:-20px;}
	.product .view .related .row {width:calc(33.33333333% - 20px); margin-left:20px; margin-bottom:40px;}
	.product .view .related .row .inner .txt-box h4 {font-size:16px;}
	.product .view .related .row .inner .txt-box p {font-size:14px;}
	/* sub 05 01 */
	.service .title {margin-bottom:50px;}
	.service .title .tit {margin-bottom:40px;}
	.service .title .tit h3 {font-size:26px; margin-bottom:18px;}
	.service .title .tit p {font-size:16px;}
	.service .title .txt {padding:20px;}
	.service .title .txt ul li {font-size:16px;}
	.service .col {display:block; margin-bottom:50px;}
	.service .col .tit-box {max-width:none; padding:30px 0 40px;}
	.service .col .tit-box h4 {font-size:26px;}
	.service .col .txt-box {width:100%; padding-top:0; padding-left:0; border-top:0;}
	.service .col .txt-box p {font-size:16px;}	
	.service .col .txt-box dl {margin-bottom:10px;}
	.service .col .txt-box dt {max-width:80px;}
	.service .col .txt-box ul li {max-width:none; margin-top:20px; font-size:16px; width:auto;}
	.service .col .txt-box ul li .inner {padding:25px 20px;}
	.service .col .txt-box ul li strong {font-size:26px; margin-left:15px;}
	
	
}

@media (max-width: 640px) {
	/* sub-visual */
	.sub-visual {height:280px; padding-top:80px;}
	.sub-visual .title p {font-size:16px; letter-spacing:.3em;}
	.sub-visual .title h2 {font-size:32px;}
	/* lnb */
	.lnb ul li a {font-size:16px; padding:14px 10px;}
	/* common */
	.real-cont {padding:80px 0 100px;}

	.doc-tit {margin-bottom:32px;}
	.doc-tit h3 {font-size:28px;}
	/* sub 01 01 */
	.introduce .txt-box {margin-bottom:32px;}
	.introduce .txt-box h4 {font-size:20px; margin-bottom:12px;}
	.introduce .txt-box p {font-size:14px;}
	.introduce .col {display:block;}
	.introduce .col dl {width:100%;}
	.introduce .col dt {max-width:80px; font-size:14px; padding:12px 10px;}
	.introduce .col dd {font-size:14px; padding:12px 10px;}
	/* sub 01 02 */
	.history .img-box {margin-bottom:60px;}
	.history .col {padding-bottom:60px;}
	.history .col:after {height:calc(100% - 20px); top:20px; left:5px;}
	.history .wrap {padding-left:24px;}
	.history .txt-box {margin-bottom:50px;}
	.history .txt-box:before {top:10px; left:-23px;}
	.history .txt-box .m-year {font-size:28px; margin-bottom:14px;}
	.history .txt-box .txt .month {max-width:30px; font-size:14px;}
	.history .txt-box .txt p {font-size:14px;}
	/* sub 01 03 */
	.directions .maps {margin-bottom:24px;}
	.directions .maps .root_daum_roughmap {height:250px !important;}
	.directions .maps .root_daum_roughmap .wrap_map {height:250px !important;}
	.directions .txt-box .btn ul li a {font-size:14px; width:140px; line-height:50px; padding:0 15px;}
	.directions .txt-box .btn ul li a span {width:24px; height:24px; margin-top:-12px; right:12px;}
	.directions .txt-box .btn ul li a span:before {width:8px; margin-left:-4px;}
	.directions .txt-box dl {font-size:14px;}
	.directions .txt-box dt {max-width:40px;}
	/* sub 02 list */
	.product .menu {top:60px;}
	.product .menu-open {width:36px; height:36px; right:-36px; top:36px;}
	.product .menu .inner {height:300px;}
	.product .menu .inner>ul>li>a {font-size:14px;}
	.product .menu .depth {padding:12px 10px;}
	.product .menu .depth li a {font-size:14px;}	
	.product .list .title {padding-bottom:60;}
	.product .list .title h3 {font-size:26px; margin-bottom:20px;}
	.product .list .title .select-box {margin-right:15px;}
	.product .list .title .select-box button {font-size:14px;}
	.product .list .title .input-box {max-width:200px;}
	.product .list .title .input-box input {font-size:14px;}
	.product .list .title .input-box input::placeholder {font-size:14px;}
	.product .list .col {margin-left:-10px;}
	.product .list .col .row {width:calc(33.3333333% - 10px); margin-left:10px; margin-bottom:30px;}
	.product .list .inner .img-box {margin-bottom:10px;}
	/* sub 02 view */
	.product .view .title {margin-bottom:30px;}
	.product .view .title h3 {font-size:26px;}
	.product .view .col {margin-bottom:40px;}
	.product .view .col .img-box {margin:0 auto 40px;}
	.product .view .col .txt-box .tit h4 {font-size:24px;}
	.product .view .col .txt-box .txt h5 {font-size:18px;}
	.product .view .col .txt-box .txt p {font-size:14px;}
	.product .view .tab-cnt {padding-bottom:40px;}
	.product .view .tab-menu ul li a {font-size:14px; padding:12px 10px;}
	.product .view .text-box .txt {margin-bottom:40px;}
	.product .view .text-box .txt p {font-size:14px;}
	.product .view .down .row {padding:20px 15px; width:50%;}
	.product .view .down .row p {font-size:14px;}
	.product .view .down .row a {width:100px; font-size:12px; line-height:30px; text-align:center;}
	.product .view .down .row a:after {display:none;}
	.product .view .related {margin-left:-10px;}
	.product .view .related .row {width:calc(33.33333333% - 10px); margin-left:10px; margin-bottom:30px;}
	/* sub 05 01 */
	.service .title {margin-bottom:40px;}
	.service .title .tit {margin-bottom:30px;}
	.service .title .tit h3 {font-size:20px; margin-bottom:12px;}
	.service .title .tit h3 br {display:none;}
	.service .title .tit p {font-size:14px;}
	.service .title .txt {padding:15px;}
	.service .title .txt ul li {font-size:14px;}
	.service .col {margin-bottom:40px;}
	.service .col .tit-box {padding:20px 0 30px;}	
	.service .col .tit-box h4 {font-size:24px;}
	.service .col .txt-box p {font-size:14px;}
	.service .col .txt-box dt {max-width:70px;}
	.service .col .txt-box ul li {font-size:14px;}
	.service .col .txt-box ul li .inner {padding:20px;}
	.service .col .txt-box ul li strong {font-size:24px; margin-left:10px;}
}

@media (max-width: 400px) {
	.product .list .title .search {display:block;}
	.product .list .title .select-box {margin-right:0; max-width:none; justify-content:flex-end; margin-bottom:15px;}
	.product .list .title .input-box {margin:0 0 0 auto;}
	.product .list .col .row {width:calc(50% - 10px);}
	.product .view .related .row {width:calc(50% - 10px);}
	
}