@charset "utf-8";

	/* 메인페이지 스타일만 정의 */
	/* section.main {padding-bottom:150px;} */

	/* 메인 비쥬얼 */
	.main .visual {
		height:850px; position:relative;background:url(../images/main/visual.jpg) no-repeat 50%;
		animation:bigToFit 2.5s; background-size:110%;
		position:relative; z-index:11;
		display:flex; align-items:center;
	}
	.main .visual h2 {
		font-size:36px; font-weight:400; color:#000; line-height:1; letter-spacing:-2px;
		padding:0 70px;
		width:1400px; margin:0 auto;
	}
	.main .visual h2 span.tit {font-size:72px; font-weight:900;}
	.main .visual h2 span {display:block; /*animation:tit_move 2.2s cubic-bezier(0.4, 0, 0.2, 1) both;*/}
	/* .main .visual h2 span.tit {animation:tit_move 1.8s cubic-bezier(0.4, 0, 0.2, 1) both;} */

	@keyframes bigToFit {
	  from {background-size:130%;}
	  to {background-size:110%;}
	}

	@keyframes tit_move {
	  /* from{transform: translate3d(-50%, 0, 0);} */
	  /* to{transform: translate3d(0, 0, 0);} */
	}

	.main .product_list {background:#f6f6f6; padding-bottom:100px;}
	.main .product_list .list {
		width:1400px; margin:0 auto; position:relative; z-index:22;
		display:flex; border-radius:30px; overflow:hidden;
		box-shadow:20px 20px 20px rgba(0,0,0,.07);
	}
	.main .product_list .list:nth-child(even) {flex-direction:row-reverse;}
	.main .product_list .list+.list {margin-top:30px;}
	.main .product_list .list>* {width:50%;}
	.main .product_list .list .txt {padding:60px 70px 70px; background:#fff; border:1px solid #e7e9ec; overflow:hidden; border-radius:30px 0 0 30px;}
	.main .product_list .list:nth-child(even) .txt {border-radius:0 30px 30px 0;}
	.main .product_list .list:nth-child(even) .img {border-radius:30px 0 0 30px;}

	.main .product_list .list .txt>*+* {margin-top:40px;}
	.main .product_list .list .txt h3 {font-size:36px; font-weight:500; color:#e95c32; letter-spacing:-2px;}
	.main .product_list .list .txt p {font-size:24px; font-weight:400; color:#000; margin-top:30px;}
	.main .product_list .list .txt ul.dotType {}
	.main .product_list .list .txt ul.dotType li {font-size:18px; color:#333; font-weight:300; padding-left:17px; position:relative;}
	.main .product_list .list .txt ul.dotType li:before {
		position:absolute; top:12px; left:1px; width:3px; height:3px; background:#d3d3d3;
	}

	.main .product_list .list .txt dl.dotType {}
	.main .product_list .list .txt dl.dotType>* {font-size:18px; color:#333; font-weight:300;}
	.main .product_list .list .txt dl.dotType dt {color:#000; font-weight:400;}
	.main .product_list .list .txt dl.dotType dd {padding-left:17px; position:relative;}
	.main .product_list .list .txt dl.dotType dd:before {
		position:absolute; top:12px; left:1px; width:3px; height:3px; background:#d3d3d3;
	}
	.main .product_list .list .txt dl.dotType dd+dt {margin-top:10px;}

	/* a.type-arrowR:hover {} */
	.main .product_list .list:first-child {margin-top:-175px !important;}

	/*퀵메뉴*/
	.main .quick_part {background:#eaeeeb; overflow:hidden; position:relative; z-index:1;}
	.main .quick_part:before {
		position:absolute; top:0; left:0; width:100%; height:100px; background:#f6f6f6;
		display:block; content:""; z-index:-1;
	}
	.main .quick_part article {
		margin:0 auto; width:1400px;
	}
	.main .quick_part article .part {
		float:left; display:inline-block;
		width:calc(100%/3 - 10px); margin-left:10px;
		border-radius:10px; padding:50px;
		color:#fff;
		height:240px;
	}
	.main .quick_part article .part h3 {font-size:24px; font-weight:700;}
	.main .quick_part article .part ul {padding-top:50px; position:relative;}
	.main .quick_part article .part ul:before {
		position:absolute; top:25px; left:0; width:60px; height:1px; background:rgba(255,255,255,.2);
		display:block; content:"";
	}
	.main .quick_part article .part ul * {line-height:1;}
	.main .quick_part article .part ul li+li {margin-top:10px;}
	.main .quick_part article .part ul li a {color:#fff; font-size:16px; padding-left:15px; position:relative; display:block;}
	.main .quick_part article .part ul li a:hover {letter-spacing:.8px;}
	.main .quick_part article .part ul li a:before {
		position:absolute; top:7px; left:0; width:5px; height:5px; background:#fff; display:block; content:"";
	}
	.main .quick_part article .part:nth-child(1) {background:no-repeat bottom 50px right 50px url(../images/main/quick-1.png) #6b9fbd;}
	.main .quick_part article .part:nth-child(2) {background:no-repeat bottom 50px right 50px url(../images/main/quick-2.png) #7cbbc0;}
	.main .quick_part article .part:nth-child(3) {background:no-repeat bottom 50px right 50px url(../images/main/quick-3.png) #8ebc86;}


	/*바이오 제품*/
	.main .bio_part {background:#eaeeeb; padding:100px 0;}
	.main .bio_part article {margin:0 auto; width:1420px;}
	.main .bio_part article .top_tit {text-align:center;}
	.main h3.tit {font-size:45px; font-weight:700; letter-spacing:-1px;}
	.main p.tit_ment {margin-top:20px; font-size:16px; color:#666;}
	.main .bio_part article .con {margin-top:30px; margin-left:-25px; position:relative; overflow:hidden; padding:20px 10px;}
	/* .main .bio_part article .con:before {display:block; content:""; clear:both;} */
	.main .bio_part article .con a {
		float:left; display:inline-block;
		width:calc(100%/3 - 25px); margin-left:25px;
		border-radius:10px; padding:70px 50px 30px;
		color:#000;
		height:410px;
		box-shadow:10px 10px 5px rgba(0,0,0,.03);
		position:relative;
	}
	.main .bio_part article .con a:nth-child(1) {background:no-repeat right bottom 30px url(../images/main/bio_product1_new.png) #fff;}
	.main .bio_part article .con a:nth-child(2) {background:no-repeat right bottom 30px url(../images/main/bio_product2.png) #fff;}
	/*221125 삭제요청*/
	/*.main .bio_part article .con a:nth-child(3) {background:no-repeat right bottom 30px url(../images/main/bio_product3.png) #fff;}*/
	.main .bio_part article .con a:nth-child(3) {background:no-repeat right bottom 30px url(../images/main/bio_product4.png) #fff;}
	.main .bio_part article .con a h4 {
		font-size:18px; font-weight:400; line-height:1.6; padding-bottom:40px;
	}
	.main .bio_part article .con a:hover h4 {
		background:no-repeat 0 100% url(../images/main/arrowR.png); transition:.5s;
		animation:arrowR_move2 .8s infinite;
	}
	@keyframes arrowR_move2 {
		0% {background-position:0 100%;}
		50% {background-position:10% 100%;}
		100% {background-position:0 100%;}
	}
	.main .bio_part article .con a p {
		color:#999; font-size:14px;
		position:absolute; bottom:70px; left:50px;
		color:#999; line-height:1.1;
	}
	.main .bio_part article .con a p span {display:block; color:#000;}

	/*contact us*/
	.main .contact {display:flex; flex-direction:row;}
	.main .contact>div {width:50%;}
	.main .contact .form {padding:100px 5vw;}
	.main .contact .form .top_tit {margin-bottom:30px;}
	.main .contact .form .top_tit .checkWrap_common {text-align:left;}
	.main .contact .form .top_tit .checkWrap_common input[type='checkbox']+label {padding-left:20px; background-size:15px; background-position:left 10px; font-size:14px; color:#000;}
	.main .contact .form .top_tit .checkWrap_common input[type='checkbox']:checked+label {color:#ee2e2c;}


	.new .form1 .con_form article {display: flex; flex-direction: column;}
	.new .form1 .con_form article+article {margin-top:20px;}
	.new .form1 .con_form article>label {width:100%; font-weight: 600; transform:rotate(0.03deg); padding:0;}
	.new .form1 .con_form article .inputWrap {width:100%; }
	.new .form1 .con_form article .inputWrap input {height:40px !important;}
	.new .form1 .con_form article p {font-size:14px; color:#888;}
	.new .form1 .con_form article .ckwrap {display: flex; align-items: center;}
	.new .form1 .con_form article .ckwrap input {height: auto !important;}
	.new .form1 .con_form article .ckwrap label {font-size:14px; fonfont-weight: normal; color:#888; padding:0 0 0 5px; line-height: 1;}
	.new .form1 .con_form article .address {display: flex; align-items: center;}
	.new .form1 .con_form article .address input[name='zipcode'] {width:100px;}
	.new .form1 .con_form article .address input+a {display:block; height:40px; padding:0 10px; line-height: 40px; font-size:14px; background: #000; color: #fff;}
	.new .form1 .con_form article .addMore input {margin-top:3px;}
	.new .form1 .con_form article .autoCode>span {height: 40px; line-height: 40px; padding:0 10px;}
	.new .form1 .con_form .ask {display:inline-block; margin-top: 20px; padding:15px 30px; border:2px solid #000; color:#000; line-height: 1;}


	.main .contact .top_tit {border-bottom:1px dotted #ccc; padding-bottom:20px;}
	.main .contact .top_tit ul {margin-top:20px; font-size:0;}
	.main .contact .top_tit ul li {display:inline-block; margin-right:30px;}
	.main .contact .top_tit ul li a {display:block; font-size:14px; font-weight:400; color:#000; padding-right:15px; background:no-repeat right center url(../images/common/arrowR-small.png);}





/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {




}


/* ************************ 노트북 (992~1280) ************************ */
@media screen and (min-width:992px) and (max-width:1400px) {


	.main .visual {background-size:cover; animation:none;}
	.main .product_list .list {width:calc(100% - 5vw*2); margin:0 5vw;}
	.main .product_list .list .txt {padding:50px;}
	.main .product_list .list .txt h3 {font-size:32px;}
	.main .product_list .list .txt p {font-size:20px;}

	.main .quick_part article {width:calc(100% - 5vw*2); margin:0 5vw;}

	.main .bio_part article {width:calc(100% - 5vw*2); margin:0 5vw;}
	.main .bio_part article .con {margin-left:0;}
	.main .bio_part article .con a {width:calc(100%/2 - 15px); margin:0;}
	.main .bio_part article .con a:nth-child(odd) {margin-right:15px;}
	.main .bio_part article .con a:nth-child(even) {margin-left:15px;}
	.main .bio_part article .con a:nth-child(2)~a {margin-top:30px;}






}


/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {

	.main .visual {background-size:cover; animation:none; height:500px; align-items:flex-start; padding-top:100px;}
	.main .visual h2 {width:100%; font-size:20px; letter-spacing:-.5px;}
	.main .visual h2 span.tit {font-size:40px;}
	.main .product_list .list {width:calc(100% - 5vw*2); margin:0 5vw; flex-wrap:wrap;}
	.main .product_list .list .txt {padding:50px;}
	.main .product_list .list .txt h3 {font-size:32px;}
	.main .product_list .list .txt p {font-size:20px;}

	.main .product_list .list>* {width:100%;}
	.main .product_list .list:nth-child(even) .txt,
	.main .product_list .list>.txt {border-radius:30px 30px 0 0;}
	.main .product_list .list:nth-child(even) .img {border-radius:0 0 30px 30px;}
	.main .product_list .list>.img {height:400px; border:1px solid #e7e9ec; border-top:0;}

	.main .quick_part article {width:calc(100% - 5vw*2); margin:0 5vw;}

	.main .bio_part article {width:calc(100% - 5vw*2); margin:0 5vw;}
	.main .bio_part article .con {margin-left:0;}
	.main .bio_part article .con a {width:100%; margin:0; height:300px;}
	.main .bio_part article .con a:nth-child(odd) {margin-right:0;}
	.main .bio_part article .con a:nth-child(even) {margin-left:0;}
	.main .bio_part article .con a~a {margin-top:20px;}

	.main .quick_part article .part {width:100%; margin-left:0;}
	.main .quick_part article .part + .part {margin-top:20px;}

	.main .contact {flex-wrap:wrap; flex-direction:column-reverse;}
	.main .contact>div {width:100%;}
	.main .contact>div.img {height:400px;}







}

/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {

	section.main {overflow-x:hidden;}
	.main .visual h2 span.tit {font-size:32px;}

	.main .product_list {padding-bottom:50px;}
	.main .bio_part {padding:50px 0;}


	.main .product_list .list .txt {padding:30px;}
	.main .product_list .list .txt h3 {font-size:28px;}
	.main .product_list .list .txt p {font-size:18px;}
	.main .product_list .list .txt>*+* {margin-top:20px;}
	.main .product_list .list .txt dl.dotType>*,
	.main .product_list .list .txt ul.dotType li {font-size:16px;}
	.main .product_list .list>.img {height:300px; border-radius:0 0 30px 30px;}

	.main .quick_part article .part,
	.main .bio_part article .con a {padding:30px;}
	.main .quick_part article .part {height:auto; background-position:bottom 30px right 30px !important;}
	.main .bio_part article .con a p {bottom:30px; left:30px;}

	.main .contact .form .top_tit {margin-bottom:30px;}

	.main .bio_part article .con {margin-top:10px;}





}
