@charset "utf-8";


/* ************************ PC ************************ */
@media screen and (min-width:1025px) {
	
	.main {}
	
	/* ******* 비주얼 ******* */
	.main-visual {background:url(../images/main/visual-img)center /cover no-repeat;display:flex; justify-content:center; align-items:center; height:800px; position:relative;}
	.main-visual:before {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,.6); position:absolute;left:0;top:0;}
	.main-visual-wrap {color:#fff; position:relative; text-align:center;}
	.main-visual h2 {}
	.main-visual h2 img {}
	.main-visual p {font-size:18px; padding:50px 0;}
	.main-visual-btn {display:flex; justify-content:center; align-items:center; }
	.main-visual-btn a {width:300px; display:block; line-height:68px; border:1px solid #fff;}
	.main-visual-btn a+a {border-left:0;}
	.main-visual-btn a span {position:relative; display:inline-block; padding-right:20px;}
	.main-visual-btn a span:before,
	.main-visual-btn a span:after {content:''; display:block; background:#fff; position:absolute;}
	.main-visual-btn a span:before { width:11px;height:1px; top:50%; right:0; }
	.main-visual-btn a span:after { width:1px;height:11px; top:43%; right:5px; }
	.main-visual-btn a:hover {background:var(--c_blue);}
	
	
	/* ******* 선택 ******* */
	.main-choose {padding:100px 0;}
	.main-choose-wrap {}
	.main-choose-tit {}
	.main-choose-tit h3 {font-size:48px; color:#000;text-align:center;}
	.main-choose-tit h3 span {color:var(--c_blue);}
	.main-choose-list {padding-top:70px;}
	.main-choose-list ul {display:flex; }
	.main-choose-list ul li {width:calc((100% - 60px)/3);}
	.main-choose-list ul li+li {margin-left:30px;}
	.main-choose-list ul li span {display:block; height:210px;}
	.main-choose-list ul li span img {object-fit: cover;}
	.main-choose-list ul li dl {padding:40px; border:1px solid #e5e5e5; border-top:0;}
	.main-choose-list ul li dt {padding-bottom:20px; color:#000; font-size:19px; font-weight:700; line-height:1;}
	.main-choose-list ul li dd {line-height:25px;}
	
	/* ******* 제품 ******* */
	.main-product {padding:100px 0; text-align:center; background:url(../images/main/main-product-bg.jpg)center /cover no-repeat; position:relative;}
	.main-product:before {content:''; display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0,0,0,.5);}
	.main-product-wrap {position:relative;}
	.main-product-tit {color:#fff;}
	.main-product-tit h3 {padding-bottom:10px; font-size:48px; font-weight:700;}
	.main-product-tit p {}
	
	.main-product-list {}
	.main-product-list ul {display:flex; flex-wrap:wrap; padding:30px 0 0;}
	.main-product-list ul li {width:calc((100% - 20px)/2); margin-left:20px; margin-top:20px; background:#fff;}
	.main-product-list ul li:nth-child(odd) {margin-left:0;}
	.main-product-list ul li a {display:flex; position:relative;}
	.main-product-list ul li a:after {content:'Detail'; width:70px; height:70px;line-height:68px;border:1px solid #e5e5e5; border-radius:50%; position:absolute; right:40px; top:50%; font-size:14px; color:#999; text-align:center; transform:translateY(-50%); transition:all var(--ani_time);}
	.main-product-list ul li a>div {}
	.main-product-list ul li a:hover {}
	.main-product-list ul li a:hover:after {background:var(--c_blue); color:#fff; border-color:transparent;}
	.main-product-list-logo {width:200px; display:flex; justify-content:center; align-items:center; border-right:1px solid #e5e5e5;}
	.main-product-list-logo img {}
	.main-product-list-txt {padding:40px 130px 40px 40px; width:calc(100% - 200px); text-align:left;}
	.main-product-list-txt h4 {font-size:19px; color:#000; padding:0 0 20px;}
	.main-product-list-txt p {line-height:25px}
	
	
	
	/* ******* 질문 ******* */
	
	.main-qna {padding:100px 0;text-align:center;}
	.main-qna-wrap {}
	.main-qna-tit {}
	.main-qna-tit h3 {font-size:48px; color:#000; font-weight:700;}
	.main-qna-list {}
	.main-qna-list ul {padding:50px 0;text-align:left;}
	.main-qna-list ul li {}
	.main-qna-list ul li:first-child a {border-top:1px solid #e5e5e5;}
	.main-qna-list ul li a {padding:30px 140px 30px 0;position:relative; display:block; border-bottom:1px solid #e5e5e5;}
	.main-qna-list ul li a:after {content:'VIEW'; width:80px; height:80px;line-height:78px;border:1px solid #e5e5e5; border-radius:50%; position:absolute; right:0; top:50%; font-size:14px; color:var(--c_blue); text-align:center; transform:translateY(-50%); transition:all var(--ani_time);}
	.main-qna-list ul li a h3 {padding-bottom:20px; font-size:21px; font-weight:700; color:var(--c_blue);}
	.main-qna-list ul li a p {line-height:25px;}
	.main-qna-list ul li a:hover {border-bottom-color:var(--c_blue);}
	.main-qna-list ul li a:hover:after {background:var(--c_blue); color:#fff; border-color:transparent;}
	/* .main-qna-list ul li a:hover h3 {color} */
	.main-qna-list .moreBtn {display:inline-block; text-align:center; width:200px; height:60px; line-height:58px; border:1px solid; color:var(--c_blue); }
	.main-qna-list .moreBtn:hover {background:var(--c_blue); color:#fff; border-color:transparent;}
	
	
	
	
	
	
	
}



/* ************************ 태블릿이하 ************************ */
@media screen and (max-width: 1024px) {
	
	.main {}
	
	
	/* ******* 비주얼 ******* */
	.main-visual {background:url(../images/main/visual-img)center /cover no-repeat;display:flex; justify-content:center; align-items:center; height:80vw; position:relative;}
	.main-visual:before {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,.6); position:absolute;left:0;top:0;}
	.main-visual-wrap {color:#fff; position:relative; text-align:center;}
	.main-visual h2 {}
	.main-visual h2 img {height:12vw;}
	.main-visual p {font-size:16px; padding:40px 0;}
	.main-visual-btn {display:flex; justify-content:center; align-items:center; }
	.main-visual-btn a {width:260px; display:block; line-height:60px; border:1px solid #fff;}
	.main-visual-btn a+a {border-left:0;}
	.main-visual-btn a span {position:relative; display:inline-block; padding-right:20px;}
	.main-visual-btn a span:before,
	.main-visual-btn a span:after {content:''; display:block; background:#fff; position:absolute;}
	.main-visual-btn a span:before { width:11px;height:1px; top:50%; right:0; }
	.main-visual-btn a span:after { width:1px;height:11px; top:43%; right:5px; }
	.main-visual-btn a:hover {background:var(--c_blue);}
	
	
	/* ******* 선택 ******* */
	.main-choose {padding:70px 20px;}
	.main-choose-wrap {}
	.main-choose-tit {}
	.main-choose-tit h3 {font-size:36px; color:#000;text-align:center;}
	.main-choose-tit h3 span {color:var(--c_blue);}
	.main-choose-list {padding-top:40px;}
	.main-choose-list ul {}
	.main-choose-list ul li {display:flex;}
	.main-choose-list ul li+li {margin-top:20px;}
	.main-choose-list ul li span {display:block; height:210px;}
	.main-choose-list ul li span img {object-fit: cover;}
	.main-choose-list ul li dl {padding:40px; border:1px solid #e5e5e5; border-left:0;}
	.main-choose-list ul li dt {padding-bottom:20px; color:#000; font-size:19px; font-weight:700; line-height:1;}
	.main-choose-list ul li dd {line-height:25px;}
	
	/* ******* 제품 ******* */
	.main-product {padding:70px 20px; text-align:center; background:url(../images/main/main-product-bg.jpg)center /cover no-repeat; position:relative;}
	.main-product:before {content:''; display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0,0,0,.5);}
	.main-product-wrap {position:relative;}
	.main-product-tit {color:#fff;}
	.main-product-tit h3 {padding-bottom:10px; font-size:36px; font-weight:700;}
	.main-product-tit p {}
	
	.main-product-list {}
	.main-product-list ul {padding:30px 0 0;}
	.main-product-list ul li {margin-top:10px; background:#fff;}
	.main-product-list ul li a {display:flex; position:relative;}
	.main-product-list ul li a:after {content:'Detail'; width:70px; height:70px;line-height:68px;border:1px solid #e5e5e5; border-radius:50%; position:absolute; right:40px; top:50%; font-size:14px; color:#999; text-align:center; transform:translateY(-50%); transition:all var(--ani_time);}
	.main-product-list ul li a>div {}
	.main-product-list ul li a:hover {}
	.main-product-list ul li a:hover:after {background:var(--c_blue); color:#fff; border-color:transparent;}
	.main-product-list-logo {width:200px; display:flex; justify-content:center; align-items:center; border-right:1px solid #e5e5e5;}
	.main-product-list-logo img {}
	.main-product-list-txt {padding:40px 130px 40px 40px; width:calc(100% - 200px); text-align:left;}
	.main-product-list-txt h4 {font-size:19px; color:#000; padding:0 0 20px;}
	.main-product-list-txt p {line-height:25px}
	
	
	
	/* ******* 질문 ******* */
	
	.main-qna {padding:70px 20px;text-align:center;}
	.main-qna-wrap {}
	.main-qna-tit {}
	.main-qna-tit h3 {font-size:36px; color:#000; font-weight:700;}
	.main-qna-list {}
	.main-qna-list ul {padding:40px 0;text-align:left;}
	.main-qna-list ul li {}
	.main-qna-list ul li:first-child a {border-top:1px solid #e5e5e5;}
	.main-qna-list ul li a {padding:30px 0;position:relative; display:block; border-bottom:1px solid #e5e5e5;}
	/* .main-qna-list ul li a:after {content:'VIEW'; width:70px; height:70px;line-height:68px;border:1px solid #e5e5e5; border-radius:50%; position:absolute; right:0; top:50%; font-size:13px; color:var(--c_blue); text-align:center; transform:translateY(-50%); transition:all var(--ani_time);} */
	.main-qna-list ul li a h3 {padding-bottom:12px; font-size:19px; font-weight:700; color:var(--c_blue);}
	.main-qna-list ul li a p {line-height:25px;}
	.main-qna-list ul li a:hover {border-bottom-color:var(--c_blue);}
	.main-qna-list ul li a:hover:after {background:var(--c_blue); color:#fff; border-color:transparent;}
	/* .main-qna-list ul li a:hover h3 {color} */
	.main-qna-list .moreBtn {display:inline-block; text-align:center; width:180px; height:54px; line-height:52px; border:1px solid; color:var(--c_blue); font-size:14px;}
	.main-qna-list .moreBtn:hover {background:var(--c_blue); color:#fff; border-color:transparent;}
	
	
}


  
@media screen and (max-width: 767px) {
	
	
	.main {}
	
	/* ******* 비주얼 ******* */
	.main {}
	.main-visual {height:500px; padding:0 20px}
	.main-visual h2 img {height:auto; width:100%;}
	.main-visual p {font-size:14px; padding:30px 0;}
	.main-visual-btn {display:block;}
	.main-visual-btn a {width:100%; line-height:48px;}
	.main-visual-btn a+a {border-left:1px solid; border-top:0;}
	
	
	/* ******* 선택 ******* */
	.main-choose {padding:50px 20px;}
	.main-choose-tit h3 {line-height:1.2; font-size:30px;}
	.main-choose-list {padding-top:30px;}
	.main-choose-list ul li {display:block;}
	.main-choose-list ul li span {height:auto;}
	.main-choose-list ul li span img {width:100%;}
	.main-choose-list ul li dl {border:1px solid #e5e5e5; border-top:0; padding:30px}
	.main-choose-list ul li dt {font-size:18px; padding-bottom:12px;}
	
	/* ******* 제품 ******* */
	.main-product {padding:50px 20px;}
	.main-product-tit h3 {font-size:30px;}
	.main-product-list ul {padding:20px 0 0;}
	.main-product-list ul li a:after {display:none;}
	.main-product-list-logo {width:40%;}
	.main-product-list-logo img {width:100%;}
	.main-product-list-txt {padding:40px 30px; width:60%;}
	.main-product-list-txt h4 {line-height:1.2; padding:0 0 12px; font-size:17px;}
	
	/* ******* 질문 ******* */
	.main-qna {padding:50px 20px;}
	.main-qna-tit h3 {font-size:30px;}
	.main-qna-list ul {padding:30px 0;}
	.main-qna-list ul li a {padding:20px 0;}
	.main-qna-list ul li a h3 {font-size:18px; line-height:1.2;}
	
	
	
	
	
	
	
}


