@charset "utf-8";

/* lnb */
.lnb ul{ display: flex; align-items: center; }
.lnb ul li{ position: relative; }
.lnb ul li::after{ content: ""; width: 1px; height: 10px; background: #CCC; position: absolute; top: 50%; right: -1px; transform: translateY(-50%); }
.lnb ul li:last-of-type::after{ display: none; }
.lnb ul li a, .lnb ul li button{ display: inline-block; font-family: var(--baseFont); font-size: 1.5rem; font-weight: 400; color: #666; padding: 15px; }
.lnb ul li.home a{ font-size: 1.6rem; padding-left: 0; }
.lnb ul li button{ background: none; border: none; }

/* sub-visual */
#sub-visual{ padding-top: 70px; }
#sub-visual h2{ font-size: 6rem; font-weight: 700; color: #222; letter-spacing: -0.02em; margin: 20px 0 45px; }

#sub-visual .visual{ position: relative; padding-bottom: 33.334%; border-radius: 20px; }
#sub-visual .visual .text-box{ position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); padding: 0 20px; text-align: center; color: #fff; display: flex; flex-direction: column; gap: 20px; }
#sub-visual .visual .text-box p{ font-size: 4.2rem; font-weight: 500; letter-spacing: -0.02em; }
#sub-visual .visual .text-box p.poppins{ font-family: var(--Poppins); font-size: 1.8rem; font-weight: 400; }

/* 메뉴별 서브 비주얼 배경 */
#sub-visual .visual01{ background: url("/img/sub/company_bg.jpg") no-repeat center center / cover; }
#sub-visual .visual02{ background: url("/img/sub/service_bg.jpg") no-repeat center center / cover; }
#sub-visual .visual03{ background: url("/img/sub/support_bg01.jpg") no-repeat center center / cover; }
#sub-visual .visual04{ background: url("/img/sub/recruit_bg.jpg") no-repeat center center / cover; }
#sub-visual .visual05{ background: url("/img/sub/manager_bg.jpg") no-repeat center center / cover; }



/* sub-lnb */
.sub-lnb{ position: sticky; top: -1px; left: 0; z-index: 200; background: #fff; }
.sub-lnb::after{ content: ""; max-width: 1700px; width: 100%; height: 1px; background: #D9D9D9; position: absolute; bottom: 0; left: 50%; transform: translate(-50%); transition: all 0.8s; }
.sub-lnb.scroll::after{ max-width: 100%; }
.sub-lnb > div{ position: relative; }
.sub-lnb .depth02{ display: flex; flex-wrap: wrap; }
.sub-lnb .depth02 > li{ position: relative; }
.sub-lnb .depth02 > li::after{ content: ""; width: 1px; height: 15px; background: #000; opacity: 0.15; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
.sub-lnb .depth02 > li > a{ display: flex; justify-content: space-between; align-items: center; gap: 88px; align-items: center; height: 70px; font-size: 1.8rem; font-weight: 600; color: #222; padding-left: 40px; padding-right: 30px; }
.sub-lnb .depth02 > li > a span{ display: inline-block; width: 30px; height: 30px; background: #EEE; border-radius: 50%; position: relative; }
.sub-lnb .depth02 > li > a span::before{ content: url("/img/sub/sub_lnb_arrow.svg"); position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%); }

/* .sub-lnb .depth02 > li.depth::before{ content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; cursor: pointer; } */
.sub-lnb .depth02 > li.depth > a span::before, .sub-lnb .depth02 > li.depth > a span::after{ content: ""; width: 10px; height: 2px; background: #000; position: absolute; top: 50%; left: 50%; }
.sub-lnb .depth02 > li.depth > a span::before{ transform: translate(-50%, -50%); }
.sub-lnb .depth02 > li.depth > a span::after{ transform: translate(-50%, -50%) rotate(-90deg); transition: transform 0.5s; }

.sub-lnb .depth02 > li.active > a span::after{ transform: translate(-50%, -50%) rotate(0deg); }

.sub-lnb .depth02 > li.on > a{ color: var(--mainColor); }

.sub-lnb .depth03{ max-width: 100%; width: 180px; background: #333; border-radius: 0 0 20px 20px; padding: 20px 0; position: absolute; top: 100%; left: 0; z-index: 100; display: none; }
.sub-lnb .depth03 > li > a{ display: inline-block; width: 100%; font-size: 1.6rem; font-weight: 300; color: #fff; padding: 10.5px 35px; }


/* common */
.sub-content{ padding: 120px 0 200px; }
.sub-content *{ letter-spacing: -0.02em; }
.gray-bg{ background: #F5F5F5; }


/* 간격 */
.pt50{ padding-top: 50px; }
.pb50{ padding-bottom: 50px; }
.pt120{ padding-top: 120px; }
.pb120{ padding-bottom: 120px; }
.pt130{ padding-top: 130px; }
.pb130{ padding-bottom: 130px; }
.pt140{ padding-top: 140px; }
.pb140{ padding-bottom: 140px; }
.pt150{ padding-top: 150px; }
.pb150{ padding-bottom: 150px; }
.pt160{ padding-top: 160px; }
.pb160{ padding-bottom: 160px; }
.pt170{ padding-top: 170px; }
.pb170{ padding-bottom: 170px; }
.pt180{ padding-top: 180px; }
.pb180{ padding-bottom: 180px; }

.mb50{ margin-bottom: 50px; }
.mb70{ margin-bottom: 70px; }


/* paging */
.paging{ display: flex; justify-content: center; align-items: center; margin-top: 80px; }
.paging a{ display: flex; justify-content: center; align-items: center; font-size: 1.6rem; font-weight: 400; color: #333; line-height: 1; }
.paging ul{ display: flex; gap: 13px; margin: 0 30px; }
.paging ul li a{ width: 30px; height: 30px; border-radius: 50%; font-family: var(--Poppins); }
.paging ul li.on a{ background: var(--mainColor); color: #fff; }

.paging .arr{ display: flex; gap: 3px; }
.paging .arr a{ color: #666; }
.paging .first i:last-of-type{ margin-left: -10px; }
.paging .last i:last-of-type{ margin-left: -10px; }


/* page-title */
.page-title{ text-align: center; }
.page-title span{ font-family: var(--Poppins); font-size: 2rem; font-weight: 500; color: var(--mainColor); }
.page-title h2{ font-size: 6rem; font-weight: 700; color: #222; letter-spacing: -0.02em; margin-top: 10px; }
.page-title p{ font-size: 2.2rem; font-weight: 400; color: #666; line-height: 1.7545; }
.page-title p:not(:only-child){ margin-top: 60px; }
.page-title p strong{ font-weight: 700; color: #222; }


/* sec-title */
.sec-title span{ font-size: 2rem; font-weight: 500; color: #222; opacity: 0.4; }
.sec-title h3{ font-size: 5rem; font-weight: 700; color: #222; }
.sec-title h3:not(:only-child){ margin-top: 10px; }


/* search-box */
.search-box{ display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 30px; }
.search-box select{ width: 300px; background: #fff url("/img/sub/select_icon.svg") no-repeat center right 30px / auto; }
.search-box .input{ width: 675px; position: relative; }

.search-box select, .search-box input{ height: 70px; border: 1px solid #DDD; appearance: none; -webkit-appearance: none; border-radius: 10px; -webkit-border-radius: 10px; padding: 0 40px; font-family: var(--baseFont); font-size: 1.8rem; font-weight: 300; color: #111; } 
.search-box .input input{ width: 100%; background: #fff; padding-right: 80px; }
.search-box .input input::placeholder{ color: #111; }
.search-box .input button{ width: 80px; height: 100%; background: none; border: none; position: absolute; top: 0; right: 0; }


/* radius-btn */
.radius-btn{ display: flex; justify-content: center; align-items: center; height: 70px; background: var(--mainColor); border: none; border-radius: 990px; font-family: var(--baseFont); font-size: 2rem; font-weight: 500; color: #fff; }
a.radius-btn:link, a.radius-btn:visited{ color: #fff; }

.radius-btn.black{ background: #333; }


/* table-box */
.table-box table{ text-align: center; }
.table-box table th, .table-box table td{ font-size: 1.7rem; border: 1px solid #CCC; padding: 20px; }
.table-box table th{ background: #F6F6F6; font-weight: 500; color: #333; }
.table-box table td{ font-weight: 300; color: #555; }
.table-box table tr > *:first-child{ border-left: none; }
.table-box table tr > *:last-child{ border-right: none; }

/* 스크롤바 커스텀 */
.scroll-y{ overflow-y: scroll; }
.scroll-y::-webkit-scrollbar{ width: 21px; }
.scroll-y::-webkit-scrollbar-thumb{ height: 20px; background: #777; border-radius: 60px; background-clip: padding-box; border: 9px solid transparent; }
.scroll-y::-webkit-scrollbar-track{ background: #f1f1f1; background-clip: padding-box; border: 10px; border: 10px solid transparent; }


@media screen and (max-width: 1740px){
	.sub-lnb::after{ max-width: calc(100% - 40px); }
}

@media screen and (max-width: 1600px){
	/* sub-visual */
	#sub-visual{ padding-top: 50px; }
	#sub-visual h2{ font-size: 5rem; }

	#sub-visual .visual .text-box{ gap: 15px; }
	#sub-visual .visual .text-box p.poppins{ font-size: 1.7rem; }
	#sub-visual .visual .text-box p{ font-size: 3.5rem; }

	/* sub-lnb */
	.sub-lnb .depth02 > li > a{ height: 65px; font-size: 1.7rem; }

	/* common */
	.sub-content{ padding: 80px 0 150px; }

	/* 간격 */
	.pt120{ padding-top: 80px; }
	.pb120{ padding-bottom: 80px; }
	.pt130{ padding-top: 90px; }
	.pb130{ padding-bottom: 90px; }
	.pt140{ padding-top: 100px; }
	.pb140{ padding-bottom: 100px; }
	.pt150{ padding-top: 100px; }
	.pb150{ padding-bottom: 100px; }
	.pt160{ padding-top: 100px; }
	.pb160{ padding-bottom: 100px; }
	.pt170{ padding-top: 110px; }
	.pb170{ padding-bottom: 110px; }
	.pt180{ padding-top: 120px; }
	.pb180{ padding-bottom: 120px; }

	/* page-title */
	.page-title span{ font-size: 1.8rem; }
	.page-title h2{ font-size: 5rem; }
	.page-title p{ font-size: 2rem; }

	/* sec-title */
	.sec-title span{ font-size: 1.8rem; }
	.sec-title h3{ font-size: 4rem; }

	/* radius-btn */
	.radius-btn{ height: 60px; font-size: 1.8rem; }
}

@media screen and (max-width: 1280px){
	/* sub-visual */
	#sub-visual{ padding-top: 30px; }
	#sub-visual h2{ font-size: 4rem; margin: 5px 0 30px; }
	#sub-visual .visual .text-box p{ font-size: 3rem; }

	/* sub-lnb */
	.sub-lnb .depth02 > li > a{ height: 60px; padding-left: 30px; padding-right: 20px; gap: 60px; }
	.sub-lnb .depth03 > li > a{ padding: 10px 30px; }

	/* common */
	.sub-content{ padding: 60px 0 100px; }

	/* paging */
	.paging{ margin-top: 50px; }
	.paging a{ font-size: 1.5rem; }
	.paging ul{ gap: 7px; margin: 0 10px; }
	.paging ul li a{ width: 27px; height: 27px; }

	/* 간격 */
	.pt50{ padding-top: 30px; }
	.pb50{ padding-bottom: 30px; }
	.pt120{ padding-top: 60px; }
	.pb120{ padding-bottom: 60px; }
	.pt130{ padding-top: 70px; }
	.pb130{ padding-bottom: 70px; }
	.pt140{ padding-top: 80px; }
	.pb140{ padding-bottom: 80px; }
	.pt150{ padding-top: 80px; }
	.pb150{ padding-bottom: 80px; }
	.pt160{ padding-top: 80px; }
	.pb160{ padding-bottom: 80px; }
	.pt170{ padding-top: 90px; }
	.pb170{ padding-bottom: 90px; }
	.pt180{ padding-top: 100px; }
	.pb180{ padding-bottom: 120px; }

	.mb50{ margin-bottom: 30px; }
	.mb70{ margin-bottom: 40px; }

	/* page-title */
	.page-title span{ font-size: 1.7rem; }
	.page-title h2{ font-size: 4rem; margin-top: 5px; }
	.page-title p{ font-size: 1.8rem; }
	.page-title p:not(:only-child){ margin-top: 30px; }

	/* sec-title */
	.sec-title span{ font-size: 1.7rem; }
	.sec-title h3{ font-size: 3.5rem; }
	.sec-title h3:not(:only-child){ margin-top: 5px; }

	/* search-box */
	.search-box select, .search-box input{ height: 60px; font-size: 1.7rem; padding: 0 20px; }
	.search-box select{ width: 250px; background-position: center right 20px; }
	.search-box .input{ width: 500px; }
	.search-box .input input{ padding-right: 65px; }
	.search-box .input button{ width: 65px; }

	/* radius-btn */
	.radius-btn{ height: 55px; font-size: 1.7rem; }

	/* table-box */
	.table-box table th, .table-box table td{ font-size: 1.6rem; padding: 15px; }
}

@media screen and (max-width: 900px){
	/* sub-visual */
	#sub-visual{ padding-top: 10px; }
	#sub-visual h2{ font-size: 3.5rem; }
	#sub-visual .visual{ padding-bottom: 250px; }
	#sub-visual .visual .text-box{ gap: 10px; }
	#sub-visual .visual .text-box p.poppins{ font-size: 1.6rem; }
	#sub-visual .visual .text-box p{ font-size: 2.5rem; }

	/* sub-lnb */
	.sub-lnb .depth02 > li > a{ height: 55px; font-size: 1.6rem; }
	.sub-lnb .depth03{ padding: 15px 0; } 

	/* page-title */
	.page-title span{ font-size: 1.6rem; }
	.page-title h2{ font-size: 3.5rem; }
	.page-title p{ font-size: 1.7rem; }
	.page-title p:not(:only-child){ margin-top: 20px; }

	/* sec-title */
	.sec-title span{ font-size: 1.6rem; }
	.sec-title h3{ font-size: 3rem; }

	/* search-box */
	.search-box select, .search-box input{ height: 55px; font-size: 1.6rem; }
	.search-box select{ width: 200px; }
	.search-box .input{ width: calc(100% - 200px); }

	/* radius-btn */
	.radius-btn{ height: 50px; font-size: 1.6rem; }

	/* table-box */
	.table-box table th, .table-box table td{ font-size: 1.5rem; padding: 10px; }
}

@media screen and (max-width: 650px){
	/* sub-lnb */
	.sub-lnb{ display: none; }
	.sub-lnb .depth02{ justify-content: center; }
	.sub-lnb .depth02 > li{ width: calc(100% / 2); border-bottom: 1px solid #D9D9D9; }
	.sub-lnb .depth02 > li:nth-of-type(even)::after{ display: none; }
	.sub-lnb .depth02 > li:last-of-type::after{ display: none; }
	.sub-lnb .depth02 > li > a{ padding: 0 15px; gap: 30px; }
	.sub-lnb .depth02 > li > a span{ width: 25px; height: 25px; }
	.sub-lnb .depth02 > li > a span::before{ top: 52%; }
	.sub-lnb .depth03{ padding: 10px 0; } 
	.sub-lnb .depth03 > li > a{ padding: 7px 20px; }
}

@media screen and (max-width: 600px){
	/* search-box */
	.search-box{ flex-direction: column; margin-bottom: 20px; }
	.search-box select, .search-box .input{ width: 100%; }
}


/* preparing - 해당 페이지는 준비중입니다 */
#preparing .content{ width: 100%; background-color: #f7f7f7; padding: 110px 60px; text-align: center; }
#preparing .content h2{ font-size: 5rem; font-weight: 700; color: #222; line-height: 1.7894; margin-top: 20px; }
#preparing .content p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.6842; }

@media screen and (max-width: 1600px){
	#preparing .content h2{ font-size: 4rem; }
	#preparing .content p{ font-size: 1.8rem; }
}

@media screen and (max-width: 1280px){
	#preparing .content{ padding: 80px 30px; }
	#preparing .content h2{ font-size: 3.5rem; margin-top: 10px; }
	#preparing .content p{ font-size: 1.7rem; }
}

@media screen and (max-width: 900px){
	#preparing .content h2{ font-size: 3rem; }
}


/* 
	회사소개
*/
/* 회사소개 - 기업정보 */
#greeting .page-title span{ font-size: 2.6rem; color: #222; }
#greeting .page-title h2{ font-family: var(--Poppins); color: var(--mainColor); }
#greeting .sec-title{ text-align: center; } 

#greeting .graph .wrap{ width: max-content; padding: 40px; background: #F5F5F5; border-radius: 1000px; position: relative; }
#greeting .graph .wrap::after{ content: url("/img/sub/company/radius_arrow.svg"); position: absolute; top: 50%; right: -37px; transform: translateY(-50%); }
#greeting .graph .flex-box .wrap:last-of-type::after{ display: none; }
#greeting .graph .radius{ height: 80px; display: flex; justify-content: center; align-items: center; text-align: center; background: #999; border-radius: 100px; font-size: 2rem; font-weight: 600; color: #fff; }
#greeting .graph .page-title{ margin-top: 100px; }

#greeting .graph .wrap .logo-box{ width: 100%; height: 90px; position: absolute; left: 50%; bottom: 4px; transform: translate(-50%, 100%); display: flex; justify-content: center; align-items: flex-end; }
#greeting .graph .wrap .logo-box::before{ content: url("/img/sub/company/logo_arrow.svg"); position: absolute; top: 0; left: 50%; transform: translateX(-50%); }

#greeting .graph .flex-box{ display: flex; justify-content: center; gap: 140px 60px; padding-bottom: 90px; }
#greeting .graph .ul{ max-width: 746px; width: calc(((100% - 120px) / 100) * 54); }
#greeting .graph ul{ display: flex; gap: 50px; }
#greeting .graph ul li{ width: calc((100% - 100px) / 3); position: relative; }
#greeting .graph ul li::after{ content: url("/img/sub/company/radius_arrow.svg"); position: absolute; top: 50%; right: -32px; transform: translateY(-50%); }
#greeting .graph ul li:last-of-type::after{ display: none; }

#greeting .graph .black{ max-width: 268px; width: calc(((100% - 120px) / 100) * 19.5); }
#greeting .graph .black .radius{ background: #333; }

#greeting .graph .color{ max-width: 366px; width: calc(((100% - 120px) / 100) * 26.5); background: rgba(198, 0, 77, 0.05); }
#greeting .graph .color .radius{ background: var(--mainColor); }
#greeting .graph .color .logo-box::before{ content: url("/img/sub/company/color_arrow.svg"); }

/*#greeting .slogan{ padding-bottom: 335px; }*/
#greeting .slogan ul{ display: flex; }
#greeting .slogan ul li{ width: 50%; text-align: center; }
#greeting .slogan ul li .circle{ width: 240px; padding-bottom: 232px; position: relative; margin: 0 auto; border: 4px solid var(--mainColor); border-radius: 50%; margin-bottom: 120px; }
#greeting .slogan ul li .circle::after{ content: url("/img/sub/company/slogan_after.svg"); position: absolute; bottom: -10px; left: 50%; transform: translate(-50%, 100%); }
#greeting .slogan ul li .text{ position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); padding: 0 20px; }
#greeting .slogan ul li .text p{ font-size: 3.4rem; font-weight: 700; color: #222; margin-bottom: 10px; }
#greeting .slogan ul li .text span{ font-size: 2rem; font-weight: 700; color: #CCC; }
#greeting .slogan ul li > p{ /* font-size: 2.4rem; */ font-size: 3.4rem; font-weight: 600; color: #222; line-height: 1.5; }
#greeting .slogan ul li > p em{ color: var(--mainColor); }

#greeting .slogan ul li.m .circle{ background: var(--mainColor); }
#greeting .slogan ul li.m .text p{ color: #fff; }
#greeting .slogan ul li.m .text span{ color: #fff; opacity: 0.4; }

#greeting .mission{ text-align: center; color: #fff; background: url("/img/sub/company/mission_bg.jpg") no-repeat center center / cover; border-radius: 20px; margin-top: -230px; }
#greeting .mission h5{ font-size: 3.4rem; font-weight: 700; margin-bottom: 70px; }
#greeting .mission h5 span{ display: inline-block; padding-bottom: 5px; border-bottom: 1px solid #fff; }
#greeting .mission ul{ max-width: max-content; margin: 0 auto; padding: 0 20px; }
#greeting .mission ul li{ max-width: max-content; font-size: 1.9rem; font-weight: 400; line-height: 1.5; padding-left: 35px; position: relative; text-align: left; }
#greeting .mission ul li:not(:last-of-type){ margin-bottom: 7px; }
#greeting .mission ul li::before{ content: "\e929"; font-family: "xeicon"; font-weight: normal; font-style: normal; position: absolute; top: 0; left: 0; color: var(--mainColor); }

#greeting .value .sec-title h3{ font-size: 3.6rem; }
#greeting .value ul{ display: flex; justify-content: center; }
#greeting .value ul li{ width: 330px; text-align: center; }
#greeting .value ul li:not(:last-of-type){ margin-right: -35px; }
#greeting .value ul li .box{ height: 130px; display: flex; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0.7); border-radius: 100px; font-size: 3rem; font-weight: 600; color: #fff; margin-bottom: 88px; position: relative; }
#greeting .value ul li .box::after{ content: url("/img/sub/company/value_arrow.svg"); position: absolute; bottom: -55px; left: 50%; transform: translateX(-50%); }
#greeting .value ul li:nth-of-type(even) .box{ background: rgba(198, 0, 77, 0.9); z-index: -10; }  

#greeting .value ul li .icon{ padding: 0 45px; }
#greeting .value ul li .icon p{ font-size: 2rem; font-weight: 400; color: #222; line-height: 1.4; margin-top: 40px; }

#greeting .location .iframe-box{ position: relative; border-radius: 20px; overflow: hidden; } 
#greeting .location .iframe .root_daum_roughmap{ width: 100%; }
#greeting .location .iframe .root_daum_roughmap .wrap_map{ height: 500px; }
#greeting .location .iframe .root_daum_roughmap .map_border{ display: none; }
#greeting .location .info{ width: 360px; background: var(--mainColor); position: absolute; bottom: 0; right: 0; z-index: 100; border-radius: 20px 0 20px 0; padding: 30px; color: #fff; }
#greeting .location .info h6{ font-size: 2.6rem; font-weight: 700; margin-bottom: 5px; }
#greeting .location .info p{ font-size: 1.8rem; font-weight: 400; }
#greeting .location .info p:not(:last-of-type){ padding-bottom: 25px; }
#greeting .location .info p span{ display: block; font-size: 1.5rem; }
#greeting .location .info p span:not(:last-of-type){ margin-bottom: 3px; }

@media screen and (max-width: 1600px){
	#greeting .page-title span{ font-size: 2.4rem; }

	#greeting .graph .wrap{ padding: 30px; }
	#greeting .graph .radius{ height: 75px; font-size: 1.7rem; }

	#greeting .slogan ul li .text p{ font-size: 2.8rem; }
	#greeting .slogan ul li .text span{ font-size: 1.8rem; }
	#greeting .slogan ul li > p{ /* font-size: 2.2rem; */ font-size: 2.8rem; }

	#greeting .mission h5{ font-size: 2.8rem; }
	#greeting .mission ul li{ font-size: 1.8rem; }

	#greeting .value .sec-title h3{ font-size: 3rem; }
	#greeting .value ul li{ width: 350px; }
	#greeting .value ul li .box{ height: 120px; font-size: 2.6rem; }
	#greeting .value ul li .icon p{ font-size: 1.8rem; }

	#greeting .location .info h6{ font-size: 2.4rem; }
	#greeting .location .info p{ font-size: 1.7rem; }
}

@media screen and (max-width: 1280px){
	#greeting .page-title span{ font-size: 2.2rem; }

	#greeting .graph .radius{ height: 70px; font-size: 1.6rem; }
	#greeting .graph .flex-box{ flex-direction: column; align-items: center; }
	#greeting .graph .ul, #greeting .graph .black, #greeting .graph .color{ width: 100%; }
	#greeting .graph .ul{ max-width: 700px; }
	#greeting .graph .black{ max-width: 240px; }
	#greeting .graph .color{ max-width: 300px; }
	#greeting .graph .wrap::after{ display: none; }
	#greeting .graph .page-title{ margin-top: 60px; }

	#greeting .slogan ul li .circle{ width: 200px; padding-bottom: 192px; margin-bottom: 90px; }
	#greeting .slogan ul li .text p{ font-size: 2.4rem; margin-bottom: 5px; }
	#greeting .slogan ul li .text span{ font-size: 1.7rem; }
	#greeting .slogan ul li > p{ /* font-size: 2rem; */ font-size: 2rem; }

	#greeting .mission h5{ font-size: 2.4rem; margin-bottom: 40px; }
	#greeting .mission ul li{ font-size: 1.7rem; }

	#greeting .value .sec-title h3{ font-size: 2.8rem; }
	#greeting .value ul li{ width: 300px; }
	#greeting .value ul li .box{ height: 110px; font-size: 2.4rem; }
	#greeting .value ul li .icon p{ font-size: 1.7rem; margin-top: 20px; }

	#greeting .location .info h6{ font-size: 2.2rem; }
	#greeting .location .info p{ font-size: 1.6rem; }
	#greeting .location .info p:not(:last-of-type){ padding-bottom: 15px; }
}

@media screen and (max-width: 1200px){
	#greeting .value ul{ flex-wrap: wrap; gap: 60px 0; }
	#greeting .value ul li{ max-width: 330px; width: calc(100% / 3); }
	#greeting .value ul li:nth-of-type(3n){ margin-right: 0; }
}

@media screen and (max-width: 1000px){
	#greeting .slogan ul{ flex-direction: column; gap: 60px; }
	#greeting .slogan ul li{ width: 100%; display: flex; justify-content: center; align-items: center; gap: 60px; }
	#greeting .slogan ul li .circle{ margin: 0; }
	#greeting .slogan ul li .circle::after{ bottom: 50%; left: calc(100% + 13px); transform: translate(100%, 50%) rotate(-90deg); }
	#greeting .slogan ul li > p{ max-width: 420px; width: calc(100% - 260px); }
}

@media screen and (max-width: 930px){
	#greeting .page-title br{ display: none; }
}

@media screen and (max-width: 900px){
	#greeting .page-title span{ font-size: 2rem; }

	#greeting .slogan ul{ gap: 40px; }
	#greeting .slogan ul li .circle{ width: 160px; padding-bottom: 152px; }
	#greeting .slogan ul li .text p{ font-size: 2.2rem; }
	#greeting .slogan ul li .text span{ font-size: 1.6rem; }
	#greeting .slogan ul li > p{ width: calc(100% - 220px); /* font-size: 1.8rem; */ font-size: 2.2rem; }

	#greeting .mission h5{ font-size: 2.2rem; margin-bottom: 20px; }

	/* #greeting .value ul{ flex-direction: column; }
	#greeting .value ul li{ width: 100%; display: flex; justify-content: center; align-items: center; gap: 80px; }
	#greeting .value ul li:not(:last-of-type){ margin-right: 0; margin-bottom: 80px; }
	#greeting .value ul li .box{ width: 180px; height: 80px; font-size: 2.2rem; margin-bottom: 0; }
	#greeting .value ul li .box::after{ top: 50%; left: calc(100% + 60px); transform: translate(100%, -50%) rotate(-90deg); }
	#greeting .value ul li .icon{ max-width: 200px; width: calc(100% - 260px); padding: 0; } */

	#greeting .value .sec-title h3{ font-size: 2.4rem; }
	#greeting .value ul li{ max-width: 100%; width: calc((100% / 2) + (35px / 2)); }
	#greeting .value ul li:nth-of-type(3n){ margin-right: -35px; }
	#greeting .value ul li:nth-of-type(2n){ margin-right: 0; }
	#greeting .value ul li .box{ height: 100px; font-size: 2.2rem; margin-bottom: 60px; }
	#greeting .value ul li .box::after{ bottom: -43px; }
	#greeting .value ul li .icon{ padding: 0 30px; }

	#greeting .location .info{ padding: 25px; }
	#greeting .location .info h6{ font-size: 2rem; }
	#greeting .location .info p{ padding-bottom: 0; }
}

@media screen and (max-width: 800px){
	#greeting .graph .ul{ max-width: 240px; border-radius: 60px; }
	#greeting .graph ul{ flex-direction: column; align-items: center; }
	#greeting .graph ul li{ width: 100%; }
	#greeting .graph ul li::after{ top: calc(100% + 14px); right: calc(50% + 3px); transform: translateX(50%) rotate(90deg); }

	#greeting .value ul li .box{ height: 85px; }
}

@media screen and (max-width: 670px){
	#greeting .slogan br{ display: none; }

	#greeting .location .iframe .root_daum_roughmap .wrap_map{ height: 300px; }
	#greeting .location .info{ width: 100%; position: static; border-radius: 0; }
}


/* 회사소개 - 연혁 */
#history .page-title{ margin-bottom: 80px; }
#history .tab-menu{ width: 100%; background: #fff; position: sticky; top: 69px; left: 0; z-index: 100; }
#history .tab-menu ul{ display: flex; justify-content: center; }
#history .tab-menu ul li{ font-size: 2.4rem; font-weight: 700; color: #DDD; padding: 20px 40px; position: relative; cursor: pointer; }
#history .tab-menu ul li::after{ content: ""; width: 2px; height: 25px; background: #DDD; position: absolute; top: 50%; right: -1px; transform: translateY(-50%); }
#history .tab-menu ul li:last-of-type::after{ display: none; }
#history .tab-menu ul li.on{ color: #222; }

#history .section-box{ margin-top: 50px; }
#history .section-box section:not(:last-of-type){ margin-bottom: 120px; }
#history .title{ margin-bottom: 40px; }
#history .title h3{ font-size: 6.4rem; font-weight: 700; color: #222; margin-bottom: 15px; }
#history .title p{ font-size: 2.4rem; font-weight: 500; color: #222; }
#history .flex-box{ max-width: 1470px; display: flex; }
#history .flex-box > div{ width: 50%; }

#history .image-box{ padding-right: 135px; display: flex; flex-direction: column; gap: 10px; }
#history .image-box figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 58.3%; border-radius: 20px; margin-bottom: -4px; }
#history .image-box figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#history .image-box p{ font-size: 1.6rem; font-weight: 400; color: #444; margin-top: 5px; }

#history .list-box dl:not(:last-of-type){ margin-bottom: 60px; border-bottom: 1px solid #DDD; padding-bottom: 60px;}
#history .list-box dl dt{ font-size: 2.2rem; font-weight: 700; color: var(--mainColor); margin-bottom: 20px; }
#history .list-box dl dd{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.8; padding-left: 15px; position: relative; }
#history .list-box dl dd::before{ content: ""; width: 4px; height: 4px; background: #666; border-radius: 50%; position: absolute; top: calc(1.8em / 2); left: 0; transform: translateY(-50%); }

@media screen and (max-width: 1600px){
	#history .tab-menu{ top: 64px; }
	#history .tab-menu ul li{ font-size: 2.2rem; }

	#history .title h3{ font-size: 5.5rem; }
	#history .title p{ font-size: 2.2rem; }

	#history .list-box dl dt{ font-size: 2rem; }
	#history .list-box dl dd{ font-size: 1.8rem; }
}

@media screen and (max-width: 1280px){
	#history .page-title{ margin-bottom: 30px; }
	#history .section-box section:not(:last-of-type){ margin-bottom: 80px; }

	#history .tab-menu{ top: 59px; }
	#history .tab-menu ul li{ font-size: 2rem; padding: 30px; }
	#history .tab-menu ul li::after{ height: 20px; }

	#history .section-box{ margin-top: 20px; }
	#history .title{ margin-bottom: 20px; }
	#history .title h3{ font-size: 4.5rem; margin-bottom: 10px; }
	#history .title p{ font-size: 2rem; }

	#history .image-box{ padding-right: 100px; }
	#history .image-box p{ font-size: 1.5rem; } 

	#history .list-box dl:not(:last-of-type){ padding-bottom: 30px; margin-bottom: 30px; }
	#history .list-box dl dt{ font-size: 1.9rem; margin-bottom: 10px; }
	#history .list-box dl dd{ font-size: 1.7rem; }
}

@media screen and (max-width: 1100px){
	#history .image-box{ padding-right: 60px; }
}

@media screen and (max-width: 1000px){
	#history .flex-box{ flex-direction: column; gap: 40px; }
	#history .flex-box > div{ width: 100%; }
	#history .image-box{ flex-direction: row; flex-wrap: wrap; padding-right: 0; }
	#history .image-box figure{ width: calc((100% - 10px) / 2); padding-bottom: 28%; }
}

@media screen and (max-width: 900px){
	#history .tab-menu{ top: 54px; }
	#history .tab-menu ul li{ font-size: 1.8rem; padding: 20px; }

	#history .title h3{ font-size: 3.5rem; margin-bottom: 5px; }
	#history .title p{ font-size: 1.8rem; }
	#history .list-box dl dd{ font-size: 1.6rem; }
}

@media screen and (max-width: 650px){
	#history .tab-menu{ top: 0; }
}


/* 회사소개 - 재무정보 */
#financial .flex-box{ display: flex; }
#financial .text-box{ width: 500px; }
#financial .text-box h4{ font-size: 4.2rem; font-weight: 700; color: #222; margin-bottom: 50px; }
#financial .text-box .select{ width: 275px; position: relative; cursor: pointer; }
#financial .text-box .select *{ font-size: 2.4rem; font-weight: 600; color: #fff; }

#financial .text-box .select .wrap{ width: 100%; background: var(--mainColor); border-radius: 35px; padding: 0 45px; position: absolute; top: 0; left: 0; }
#financial .text-box .select p, #financial .text-box .select ul li{ padding: 20px 5px; }
#financial .text-box .select p{ position: relative; }
#financial .text-box .select p::after{ content: url("/img/sub/company/financial_select_icon.svg"); position: absolute; top: 45%; right: 0; transform: translateY(-50%); transition: all 0.5s; }
#financial .text-box .select ul{ display: none; }
#financial .text-box .select ul li{ border-top: 1px dashed rgba(255, 255, 255, 0.3); }
#financial .text-box .select ul li.active{ display: none; }

#financial .tab-box{ width: calc(100% - 500px); }
#financial .tab-box .tab:not(:first-of-type){ display: none; }

#financial .text-box .select.on{ border-radius: 35px 35px 0 0; }
#financial .text-box .select.on p::after{ top: 52%; transform: translateY(-50%) rotate(-180deg); }

#financial .tab-box table th, #financial .tab-box table td{ height: 70px; padding: 0 60px; border: 1px solid #CCC; }
#financial .tab-box table thead{ background: #333; }
#financial .tab-box table thead th{ font-size: 2.4rem; font-weight: 600; color: #fff; letter-spacing: 0; }
#financial .tab-box table tbody *{ font-size: 2rem; font-weight: 200; color: #222; }
#financial .tab-box table tbody td{ /* text-align: right; */ text-align: center; }

#financial .tab-box table tr.total{ background: #F5F5F5; }
#financial .tab-box table tr.total *{ font-size: 2.2rem; font-weight: 600; }
#financial .right{ font-size: 1.8rem; font-weight: 300; color: #222; text-align: right; margin-bottom: 15px; }

@media screen and (max-width: 1600px){
	#financial .text-box h4{ font-size: 2.8rem; }
	#financial .text-box .select *{ font-size: 2.2rem; }

	#financial .tab-box table th, #financial .tab-box table td{ height: 65px; }
	#financial .tab-box table thead th{ font-size: 2.2rem; }
	#financial .tab-box table tbody *{ font-size: 1.8rem; }
	#financial .tab-box table tr.total *{ font-size: 2rem; }
	#financial .right{ font-size: 1.7rem; }
}

@media screen and (max-width: 1280px){
	#financial .text-box{ width: 350px; }
	#financial .text-box h4{ font-size: 2.6rem; margin-bottom: 30px; }
	#financial .text-box .select{ width: 230px; }
	#financial .text-box .select *{ font-size: 2rem; }
	#financial .text-box .select .wrap{ padding: 0 30px; }
	#financial .text-box .select p, #financial .text-box .select ul li{ padding: 15px 5px; }

	#financial .tab-box{ width: calc(100% - 350px); }
	#financial .tab-box table th, #financial .tab-box table td{ height: 55px; }
	#financial .tab-box table thead th{ font-size: 2rem; }
	#financial .tab-box table tbody *{ font-size: 1.7rem; }
	#financial .tab-box table tr.total *{ font-size: 1.8rem; }
	#financial .right{ font-size: 1.6rem; margin-bottom: 10px; }
}

@media screen and (max-width: 1000px){
	#financial .flex-box{ flex-direction: column; }
	#financial .text-box, #financial .tab-box{ width: 100%; }

	#financial .text-box{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
	#financial .text-box h4{ margin-bottom: 0; }
	#financial .text-box .select{ width: 180px; }
	#financial .text-box .select .wrap{ padding: 0 20px; }
	#financial .text-box .select p, #financial .text-box .select ul li{ padding: 12px 5px; }
}

@media screen and (max-width: 900px){
	#financial .text-box h4{ font-size: 2.4rem; }
	#financial .text-box .select *{ font-size: 1.8rem; }

	#financial .tab-box table th, #financial .tab-box table td{ height: 50px; padding: 0 30px; }
	#financial .tab-box table thead th{ font-size: 1.8rem; }
	#financial .tab-box table tbody *{ font-size: 1.6rem; }
	#financial .tab-box table tr.total *{ font-size: 1.7rem; }
	#financial .right{ font-size: 1.5rem; }
}


/* 회사소개 - 공고 */
#announce .announce-list{ display: flex; flex-wrap: wrap; gap: 30px; }
#announce .announce-list > li{ width: calc((100% - 60px) / 3); background: #F1F1F1; border-radius: 20px; padding: 50px; padding-bottom: 40px; position: relative; transition: all 0.5s; }
#announce .announce-list > li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }

#announce .announce-list h5{ width: calc(100% - 30px); height: 3em; font-size: 3rem; font-weight: 600; color: #111; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.5s; }
#announce .announce-list .date{ display: flex; gap: 13px; font-size: 1.8rem; font-weight: 300; color: #111; margin-top: 65px; }
#announce .announce-list li{ transition: all 0.5s; }
#announce .announce-list .date .day{ font-family: var(--Poppins); color: #AAA; }
#announce .announce-list button{ width: 65px; height: 65px; background: #fff; border: none; border-radius: 50%; position: absolute; bottom: 20px; right: 20px; }
#announce .announce-list button::before, #announce .announce-list button::after{ content: ""; width: 17px; height: 1px; background: #000; position: absolute; top: 50%; left: 50%; }
#announce .announce-list button::before{ transform: translate(-50%, -50%); }
#announce .announce-list button::after{ transform: translate(-50%, -50%) rotate(-90deg); }

#announce .announce-list > li:hover{ background: var(--mainColor); }
#announce .announce-list > li:hover h5{ color: #fff; }
#announce .announce-list > li:hover .date li{ color: #fff; }
#announce .announce-list > li:hover .date li.day{ color: rgba(255, 255, 255, 0.5); }

@media screen and (max-width: 1600px){
	#announce .announce-list > li{ padding: 45px; padding-bottom: 40px; }
	#announce .announce-list h5{ font-size: 2.6rem; }
	#announce .announce-list .date{ font-size: 1.7rem; }
	#announce .announce-list button{ width: 60px; height: 60px; }
}

@media screen and (max-width: 1280px){
	#announce .announce-list > li{ padding: 35px; }
	#announce .announce-list h5{ font-size: 2.4rem; }
	#announce .announce-list .date{ font-size: 1.6rem; }
	#announce .announce-list button{ width: 60px; height: 60px; }
}

@media screen and (max-width: 1200px){
	#announce .announce-list{ gap: 20px; }
	#announce .announce-list > li{ width: calc((100% - 40px) / 3); }
	#announce .announce-list h5{ width: 100%; }
}

@media screen and (max-width: 1000px){
	#announce .announce-list > li{ width: calc((100% - 20px) / 2); }
	#announce .announce-list .date{ margin-top: 45px; }
}

@media screen and (max-width: 900px){
	#announce .announce-list > li{ padding: 30px; }
	#announce .announce-list h5{ font-size: 2.2rem; }
	#announce .announce-list .date{ font-size: 1.5rem; }
	#announce .announce-list button{ width: 50px; height: 50px; }
}

@media screen and (max-width: 650px){
	#announce .announce-list > li{ width: 100%; }
	#announce .announce-list .date{ margin-top: 35px; }
	#announce .announce-list button{ width: 45px; height: 45px; }
	#announce .announce-list button::before, #announce .announce-list button::after{ width: 13px; }
}


/* 
	LG가전구독
*/
/* 플로팅 메뉴 */
.service-menu{ width: 115px; opacity: 1; transition: all 0.5s; }
.service-menu ul li{ padding: 15px; background: var(--mainColor); border-radius: 10px; position: relative; text-align: right; transition: border-radius 0.5s; }
.service-menu ul li:not(:last-of-type){ margin-bottom: 10px; }
.service-menu ul li p{ font-size: 1.6rem; font-weight: 500; color: #fff; letter-spacing: -0.06em; text-align: left; margin-bottom: 10px; }
.service-menu ul li .arrow{ width: 40px; height: 40px; background: #fff; border-radius: 50%; position: absolute; bottom: 2px; left: 2px; display: flex; justify-content: center; align-items: center; opacity: 0; overflow: hidden; transition: opacity 0.5s; }
.service-menu ul li .arrow img{ position: relative; top: 0; left: -50%; transition: left 0.5s; }

.service-menu ul li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }

.opacity .service-menu{ opacity: 0; visibility: hidden; }

@media (hover: hover){
	.service-menu ul li:hover{ border-radius: 10px 10px 10px 25px; }
	.service-menu ul li:hover .arrow{ opacity: 1; }
	.service-menu ul li:hover .arrow img{ left: 0; }
}

/* product-tab pc*/
.product-tab-pc{ margin: 60px 0; }
.product-tab-pc ul{ display: flex; flex-wrap: wrap; /* gap: 35px 60px; */ margin: 1px -30px; }
.product-tab-pc ul li{ margin: 17px 30px; }
.product-tab-pc ul li a{ font-size: 3rem; font-weight: 700; color: rgba(34, 34, 34, 0.2); padding-bottom: 11px; position: relative; transition: all 0.5s; }
.product-tab-pc ul li a::after{ content: ""; width: 100%; height: 3px; background: #333; position: absolute; bottom: 0; left: 0; transform: scaleX(0); transform-origin: left; transition: all 0.5s; }

.product-tab-pc ul li.on a{ color: #222; }
.product-tab-pc ul li.on a::after{ transform: scaleX(1); }

/* product-tab mobile*/
.product-tab-mobile{ display: none; }
.product-tab-mobile{ margin: 60px 0; }
.product-tab-mobile ul{ display: flex; flex-wrap: wrap; /* gap: 35px 60px; */ margin: 1px -30px; }
.product-tab-mobile ul li{ margin: 17px 30px; }
.product-tab-mobile ul li a{ font-size: 3.4rem; font-weight: 700; color: rgba(34, 34, 34, 0.2); padding-bottom: 11px; position: relative; transition: all 0.5s; }
.product-tab-mobile ul li a::after{ content: ""; width: 100%; height: 3px; background: #333; position: absolute; bottom: 0; left: 0; transform: scaleX(0); transform-origin: left; transition: all 0.5s; }

.product-tab-mobile ul li.on a{ color: #222; }
.product-tab-mobile ul li.on a::after{ transform: scaleX(1); }

@media (hover: hover){
	.product-tab-pc ul li:hover a{ color: #222; }
	.product-tab-pc ul li:hover a::after{ transform: scaleX(1); }
	.product-tab-mobile ul li:hover a{ color: #222; }
	.product-tab-mobile ul li:hover a::after{ transform: scaleX(1); }
}

/* 공통 */
.video-box{ display: flex; align-items: center; }
.video-box .text{ width: 35.133%; padding-right: 80px; }
.video-box .text:only-child{ width: 100%; padding-right: 0 !important; padding-left: 0 !important; }
.video-box .text .sec-title{ margin-bottom: 30px; }
.video-box .text p{ font-size: 1.9rem; font-weight: 400; line-height: 1.6842; color: #666; }
.video-box .text p em{ color: var(--mainColor); }

.video-box .iframe{ width: 64.867%; position: relative; overflow: hidden; padding-bottom: 36.7%; border-radius: 20px; }
.video-box .iframe img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.video-box .iframe iframe{ width: 100%; height: 100%; position: absolute; }

.video-box.reverse{ flex-direction: row-reverse; }
.video-box.reverse .text{ padding-right: 0; padding-left: 80px; }

@media screen and (max-width: 1600px){
	/* product-tab */
	.product-tab-pc{ display: none; }
	.product-tab-mobile{ display: block; }
	.product-tab-mobile ul li a{ font-size: 2.8rem; }

	/* 공통 */
	.video-box .text p{ font-size: 1.8rem; }	
}

@media screen and (max-width: 1280px){
	/* 플로팅 메뉴 */
	.service-menu{ width: 100px; }
	.service-menu ul li{ padding: 10px; }
	.service-menu ul li p{ font-size: 1.5rem; }
	.service-menu ul li > img{ height: 38px; }

	/* product-tab */
	.product-tab-pc{ display: none; }
	.product-tab-mobile{ display: block; margin-bottom: 30px; }
	.product-tab-mobile ul{ /* gap: 30px; */ margin: -15px; }
	.product-tab-mobile ul li{ margin: 15px; }
	.product-tab-mobile ul li a{ font-size: 2.4rem; }

	/* 공통 */
	.video-box .text{ width: 45%; padding-right: 40px; }
	.video-box .text .sec-title{ margin-bottom: 15px; }
	.video-box .text p{ font-size: 1.7rem; }	

	.video-box .iframe{ width: 55%; padding-bottom: 30.7%; }

	.video-box.reverse .text{ padding-left: 40px; }
}

@media screen and (max-width: 900px){
	/* 플로팅 메뉴 */
	.service-menu{ width: 95px; }
	.service-menu ul li p{ font-size: 1.4rem; }
	.service-menu ul li > img{ height: 35px; }
	.service-menu ul li .arrow{ width: 35px; height: 35px; bottom: 3px; left: 3px; }
	.service-menu ul li .arrow img{ width: 13px; }

	/* product-tab */
	.product-tab-pc{ display: none; }
	.product-tab-mobile ul{ /* gap: 20px; */ margin: -10px; }
	.product-tab-mobile ul li{ margin: 10px; }
	.product-tab-mobile ul li a{ font-size: 2rem; padding-bottom: 5px; }

	/* 공통 */
	.video-box, .video-box.reverse{ flex-direction: column-reverse; }
	.video-box .text, .video-box .iframe{ width: 100%; }
	.video-box .text{ margin-top: 50px; padding-right: 0; }
	.video-box .text:only-child{ margin-top: 0; }
	.video-box .text p{ font-size: 1.6rem; }	
	.video-box .iframe{ padding-bottom: 56.7%; }

	.video-box.reverse .text{ padding-left: 0; }
}

@media screen and (max-width: 710px){
	/* 공통 */
	#service #sub-visual br{ display: none; }
}


/* LG가전구독 - 구독(케어)소개 */
#service .type-box{ margin-top: 35px; }
#service .type-box ul li:not(:last-of-type){ margin-bottom: 125px; padding-bottom: 90px; border-bottom: 1px solid #ECECEC; }
#service .type-box dl{ display: flex; align-items: flex-start; }
#service .type-box dl dt{ display: flex; align-items: center; gap: 45px; width: 540px; font-size: 5rem; font-weight: 700; color: #222; }
#service .type-box dl dt .num{ font-size: 1.6rem; color: var(--mainColor); }
#service .type-box dl dd{ width: calc(100% - 540px); } 
#service .type-box dl dd p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.6842; }
#service .type-box dl dd p:not(:last-of-type){ margin-bottom: 25px; }
#service .type-box dl dd p.color{ font-size: 1.7rem; color: var(--mainColor); line-height: 1.8823; }

.video-box .text .radius-btn{ width: 230px; margin-top: 90px; }

#service .service ul{ display: flex; flex-wrap: wrap; gap: 30px; }
#service .service ul li{ width: calc((100% - 60px) / 3); text-align: center; }
#service .service ul li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 63%; border-radius: 20px; margin-bottom: -4px; }
#service .service ul li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#service .service ul li p{ font-size: 2.2rem; font-weight: 600; color: #222; margin-top: 30px; }

#service .good ul li{ display: flex; align-items: center; }
#service .good ul li:not(:last-of-type){ margin-bottom: 170px; }
#service .good ul li > div{ width: 50%; }
#service .good ul li .figure figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 74.5%; border-radius: 20px; }
#service .good ul li .figure figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#service .good ul li .text{ padding-left: 115px; }
#service .good ul li .text .sec-title{ margin-bottom: 35px; }
#service .good ul li .text p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.6842; position: relative; }
#service .good ul li .text p.dot{ padding-left: 15px; }
#service .good ul li .text p.dot::before{ content: ""; width: 3px; height: 3px; background: #666; border-radius: 50%; position: absolute; top: calc(1.6842em / 2); left: 0; transform: translateY(-50%); }
#service .good ul li .text .a-box{ display: flex; gap: 25px; margin-top: 100px; }
#service .good ul li .text .a-box .radius-btn{ max-width: 270px; width: calc((100% - 25px) / 2); }

#service .good ul li .text table{ text-align: center; margin: 40px 0 25px; }
#service .good ul li .text table th, #service .good ul li .text table td{ font-size: 1.7rem; border: 1px solid #CCC; padding: 20px; }
#service .good ul li .text table tr *:first-child{ border-left: none; }
#service .good ul li .text table tr *:last-child{ border-right: none; }
#service .good ul li .text table th{ font-weight: 500; color: #333; background: #F6F6F6; }
#service .good ul li .text table td{ font-weight: 300; color: #555; }

#service .good ul li:nth-of-type(even){ flex-direction: row-reverse; }
#service .good ul li:nth-of-type(even) .text{ padding-left: 0; padding-right: 115px; }

@media screen and (max-width: 1600px){
	#service .type-box ul li:not(:last-of-type){ margin-bottom: 80px; padding-bottom: 50px; }
	#service .type-box dl dt{ width: 450px; font-size: 4rem; }
	#service .type-box dl dd{ width: calc(100% - 450px); }
	#service .type-box dl dd p{ font-size: 1.8rem; }
	#service .type-box dl dd p.color{ font-size: 1.6rem; }

	.video-box .text .radius-btn{ width: 200px; }

	#service .service ul li p{ font-size: 2rem; }

	#service .good ul li:not(:last-of-type){ margin-bottom: 120px; }
	#service .good ul li .text{ padding-left: 80px; }
	#service .good ul li .text p{ font-size: 1.8rem; }

	#service .good ul li:nth-of-type(even) .text{ padding-right: 80px; }
}

@media screen and (max-width: 1280px){
	#service .type-box{ margin-top: 0; }
	#service .type-box ul li:not(:last-of-type){ margin-bottom: 30px; padding-bottom: 30px; }
	#service .type-box dl dt{ width: 400px; font-size: 3.5rem; gap: 20px; }
	#service .type-box dl dt .num{ font-size: 1.5rem; }
	#service .type-box dl dd{ width: calc(100% - 400px); }
	#service .type-box dl dd p{ font-size: 1.7rem; }
	#service .type-box dl dd p:not(:last-of-type){ margin-bottom: 15px; }
	#service .type-box dl dd p.color{ font-size: 1.5rem; }

	.video-box .text .radius-btn{ width: 170px; margin-top: 50px; }

	#service .service ul li p{ font-size: 1.8rem; margin-top: 15px; }

	#service .good ul li:not(:last-of-type){ margin-bottom: 90px; }
	#service .good ul li .text{ padding-left: 60px; }
	#service .good ul li .text .sec-title{ margin-bottom: 20px; }
	#service .good ul li .text p{ font-size: 1.7rem; }
	#service .good ul li .text table{ margin: 25px 0 15px; }
	#service .good ul li .text table th, #service .good ul li .text table td{ font-size: 1.6rem; padding: 15px; }
	#service .good ul li .text .a-box{ margin-top: 50px; gap: 15px; }

	#service .good ul li:nth-of-type(even) .text{ padding-right: 60px; }
}

@media screen and (max-width: 1000px){
	#service .type-box dl{ flex-direction: column; }
	#service .type-box dl dt{ width: 100%; }
	#service .type-box dl dd{ width: 100%; margin-top: 20px; }

	#service .good ul li{ flex-direction: column; }
	#service .good ul li:nth-of-type(even){ flex-direction: column; }
	#service .good ul li > div{ width: 100%; }
	#service .good ul li .text{ padding-left: 0; padding-top: 30px; }
	#service .good ul li .text .a-box .radius-btn{ max-width: 200px; }

	#service .good ul li:nth-of-type(even) .text{ padding-right: 0; }
}

@media screen and (max-width: 900px){
	#service .type-box dl dt{ font-size: 3rem; }

	.video-box .text .radius-btn{ width: 150px; margin-top: 30px; }

	#service .service ul li{ width: calc((100% - 30px) / 2); }
	#service .service ul li p{ font-size: 1.7rem; }

	#service .good ul li .text .sec-title{ margin-bottom: 15px; }
	#service .good ul li .text p{ font-size: 1.6rem; }
	#service .good ul li .text table{ margin: 15px 0; }
	#service .good ul li .text table th, #service .good ul li .text table td{ padding: 10px; }
}

@media screen and (max-width: 700px){
	#service .service ul { gap: 40px 20px; }
	#service .service ul li{ width: calc((100% - 20px) / 2); }
	#service .service ul li p{ margin-top: 15px; }
}

@media screen and (max-width: 600px){
	#service .service ul li{ width: 100%; }

	#service .good ul li .text .a-box .radius-btn{ max-width: 100%; }
}

@media screen and (max-width: 500px){
	#service.careship br{ display: none; }
}

/* LG가전구독 - 제품별 서비스 */
#product.sub-content{ padding-bottom: 0; }
#product .care .care-list ul li{ display: flex; align-items: center; margin-bottom: 170px; }
#product .care .care-list ul li .text-box{ width: 45.33%; padding-right: 60px; }
#product .care .care-list ul li .text-box .num{ display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--mainColor); font-size: 1.4rem; font-weight: 700; color: #fff; line-height: 1; }
#product .care .care-list ul li .text-box .sec-title{ margin: 25px 0; }
#product .care .care-list ul li .text-box > p{ font-size: 2.2rem; font-weight: 400; color: #444; line-height: 1.4; }
#product .care .care-list ul li .text-box .p-box{ padding: 15px 0; margin-top: 50px; position: relative; }
#product .care .care-list ul li .text-box .p-box::before{ content: ""; width: 20px; height: 1px; background: var(--mainColor); position: absolute; top: 0; left: 0; }
#product .care .care-list ul li .text-box .p-box p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.6842; position: relative; }
#product .care .care-list ul li .text-box .p-box p:not(:last-of-type){ margin-bottom: 5px; }
#product .care .care-list ul li .text-box .p-box p.dot{ padding-left: 15px; }
#product .care .care-list ul li .text-box .p-box p.dot::before{ content: ""; width: 3px; height: 3px; background: #999; border-radius: 50%; position: absolute; top: calc(0.8421em - 1.5px); left: 0; }
#product .care .care-list ul li .text-box .p-box p .indent{ display: block; font-size: 1.7rem; font-weight: 400; color: #666; line-height: 1.47; margin-top: 10px; padding-left: 15px; position: relative; }
#product .care .care-list ul li .text-box .p-box p .indent::before{ content: "-"; position: absolute; top: 0; left: 0; }

#product .care .care-list ul li .image-box{ width: 54.67%; }
#product .care .care-list ul li .image-box figure{ width: 100%; overflow: hidden; border-radius: 20px; margin-bottom: -4px; }
#product .care .care-list ul li .image-box figure img{width: 100%;}

#product .care .care-list ul li:nth-of-type(even){ flex-direction: row-reverse; }
#product .care .care-list ul li:nth-of-type(even) .text-box{ padding-right: 0; padding-left: 60px; }

#product .border .inner{ display: flex; align-items: center; gap: 30px 100px; border: 1px solid #E7E7E7; border-radius: 20px; padding: 90px; }
#product .border .inner:not(:last-of-type){ margin-bottom: 50px; }
#product .border .text{ width: 400px; }
#product .border .text h5{ font-size: 3.8rem; font-weight: 700; color: #222; letter-spacing: 0; }
#product .border .text > p{ font-size: 1.8rem; font-weight: 400; color: #444; line-height: 1.4; margin: 20px 0 50px; }
#product .border .text .p-box{ position: relative; padding-top: 15px; }
#product .border .text .p-box::before{ content: ""; width: 20px; height: 1px; background: var(--mainColor); position: absolute; top: 0; left: 0; }
#product .border .text .p-box p{ font-size: 1.7rem; font-weight: 400; color: #666; position: relative; }
#product .border .text .p-box p:not(:last-of-type){ margin-bottom: 10px; }
#product .border .text .p-box p.dot{ padding-left: 15px; }
#product .border .text .p-box p.dot::before{ content: ""; width: 3px; height: 3px; background: #666; border-radius: 50%; position: absolute; top: calc(1.3em / 2); left: 0; transform: translateY(-50%); }
#product .border .table-box{ width: calc(100% - 500px); }
#product .border .table-box .table:not(:last-of-type){ margin-bottom: 40px; }
#product .border .table-box .table h5{ font-size: 2rem; font-weight: 700; color: #333; margin-bottom: 15px; }
#product .border .table-box > p{ font-size: 1.6rem; font-weight: 300; color: #555; line-height: 1.75; margin-top: 20px; }

.w230{ width: 230px; }
.w100{ width: 100px; }

#product .guide-box{ background: #F8F8F8; }
#product .guide-box .sec-title{ margin-bottom: 30px; }
#product .guide-box p{ font-size: 2.2rem; font-weight: 400; color: #666; letter-spacing: 0; }
#product .guide-box > p{ margin-bottom: 30px; }
#product .guide-box .dot li{ font-size: 1.9rem; font-weight: 400; color: #666; letter-spacing: 0; padding-left: 15px; position: relative; }
#product .guide-box .dot li::before{ content: ""; width: 3px; height: 3px; background: #999; border-radius: 50%; position: absolute; top: calc(1.3em / 2); left: 0; transform: translateY(-50%); }


#product .tip .sec-title{ margin-bottom: 60px; }
#product .tip .sec-title .mark{ max-width: max-content; font-size: 2.4rem; font-weight: 600; color: #fff; padding: 10px 30px; padding-right: 50px; background: var(--mainColor); border-radius: 0 30px 30px 0; opacity: 1; margin-bottom: 20px; }
#product .tip .pc{ margin-top: -7%; }
#product .tip .mobile{ display: none; }
#product .tip .mobile figure{ width: 100%; background: #fff; border-radius: 20px; overflow: hidden; text-align: center; }
#product .tip .mobile figure img{ max-width: 70%; }
#product .tip .dl{ margin: 30px 0; }
#product .tip .dl dl:not(:last-of-type){ margin-bottom: 20px; }
#product .tip dl{ background: #fff; border: 2px solid var(--mainColor); border-radius: 40px; padding: 30px; } 
#product .tip dl dt{ font-size: 2.2rem; font-weight: 700; color: #222; margin-bottom: 10px; }
#product .tip dl dd{ font-size: 1.7rem; font-weight: 400; color: #444; position: relative; padding-left: 15px; }
#product .tip dl dd::before{ content: ""; width: 4px; height: 4px; background: #444; border-radius: 50%; position: absolute; top: calc(1.3em / 2); left: 0; transform: translateY(-50%); }
#product .tip dl dd:not(:last-of-type){ margin-bottom: 10px; }
#product .tip ul li{ font-size: 1.5rem; font-weight: 400; color: #444; padding-left: 12px; text-indent: -12px; }
#product .tip ul li:not(:last-of-type){ margin-bottom: 7px; }

#product .slide{ overflow: hidden; }
#product .slide .sec-title{ margin-bottom: 40px; }
#product .slide .wrap-box{ position: relative; }
#product .slide .btn{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; justify-content: space-between; pointer-events: none; }
#product .slide .btn button{ width: 50px; height: 50px; background: #fff; border: 1px solid #DDD; border-radius: 50%; position: relative; top: 50%; transition: all 0.5s; pointer-events: auto; }
#product .slide .btn button img{ position: relative; left: -1px; top: 1px; }
#product .slide .btn button::after{ content: url("/img/sub/service/slide_arrow_on.svg"); position: absolute; top: calc(50% + 1px); left: calc(50% - 1px); transform: translate(-50%, -50%); opacity: 0; transition: all 0.5s; }
#product .slide .btn button.prev{ left: -20px; transform: translateX(-100%); }
#product .slide .btn button.next{ right: -20px; transform: translateX(100%) rotate(180deg); }

@media (hover: hover){
	#product .slide .btn button:hover{ border: 1px solid var(--mainColor); }
	#product .slide .btn button:hover::after{ opacity: 1; }
}

#product .slide .slick-list{ margin-right: -45px; }
#product .slide	.slick-track{ margin: 0 !important; }
#product .slide .content{ margin-right: 45px; position: relative; }
#product .slide .content figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 57.6%; border-radius: 20px; }
#product .slide .content figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#product .slide .content  p{ font-size: 2rem; font-weight: 500; color: #444; letter-spacing: 0; line-height: 1.5; margin-top: 15px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#product .slide .content a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }
#product .slide .content .video{ width: 100%; position: relative; overflow: hidden; padding-bottom: 56%; border-radius: 20px; }
#product .slide .content .video iframe{ width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

#product .more .text{ max-width: 625px; }
#product .more h4{ font-size: 3.5rem; font-weight: 300; color: #222; letter-spacing: -0.05em; line-height: 1.6; }
#product .more h4 strong{ font-weight: 600; }
#product .more h4 strong.big{ font-size: 5rem; color: var(--mainColor); }
#product .more .flex{ display: flex; gap: 25px; }
#product .more .flex .radius-btn{ max-width: 275px; width: calc((100% - 25px) / 2); }

/* 제품별 배경이미지 */
#product.water-purifier .more{ background: url("/img/sub/service/water_purifier_bg.jpg") no-repeat center center / cover; }
#product.ice-purifier-fridge .more{ background: url("/img/sub/service/ice_purifier_fridge_bg.jpg") no-repeat center center / cover; }
#product.air-purifier .more{ background: url("/img/sub/service/air_purifier_bg.jpg") no-repeat center center / cover; }
#product.air-tower .more{ background: url("/img/sub/service/air_tower_bg.jpg") no-repeat center center / cover; }
#product.air-furniture .more{ background: url("/img/sub/service/air_furniture_bg.jpg") no-repeat center center / cover; }
#product.air-conditioner .more{ background: url("/img/sub/service/air_conditioner_bg.jpg") no-repeat center center / cover; }
#product.electric-range .more{ background: url("/img/sub/service/electric_range_bg.jpg") no-repeat center center / cover; }
#product.dishwasher .more{ background: url("/img/sub/service/dishwahser_bg.jpg") no-repeat center center / cover; }
#product.wash-tower .more{ background: url("/img/sub/service/wash_tower_bg.png") no-repeat center center / cover; }
/* #product.wash-tower .more{ background: url("/img/sub/service/wash_tower_bg_01.jpg") no-repeat center center / cover; } */
#product.washing-machine .more{ background: url("/img/sub/service/washing_machine_bg.jpg") no-repeat center center / cover; }
#product.clothes-dryer .more{ background: url("/img/sub/service/clothes_dryer_bg.jpg") no-repeat center center / cover; }
#product.styler .more{ background: url("/img/sub/service/styler_bg.jpg") no-repeat center center / cover; }
#product.cleaner .more{ background: url("/img/sub/service/cleaner_bg.jpg") no-repeat center center / cover; }
#product.massage-chair .more{ background: url("/img/sub/service/massage_chair_bg.jpg") no-repeat center center / cover; }
#product.plant-living .more{ background: url("/img/sub/service/plant_living_bg.jpg") no-repeat center center / cover; }
#product.fridge .more{ background: url("/img/sub/service/fridge_bg.jpg") no-repeat center center / cover; }
#product.dehumidifiers .more{ background: url("/img/sub/service/dehumidifiers_bg.jpg") no-repeat center center / cover; }
#product.humidifiers .more{ background: url("/img/sub/service/humidifiers_bg.jpg") no-repeat center center / cover; }
#product.ventilation-system .more{ background: url("/img/sub/service/ventilation_system_bg.jpg") no-repeat center center / cover; }
#product.wash-combo .more{ background: url("/img/sub/service/wash_combo_bg.jpg") no-repeat center center / cover; }
#product.microwaves-and-ovens .more{ background: url("/img/sub/service/microwaves_and_ovens_bg.jpg") no-repeat center center / cover; }
#product.air-booster .more{ background: url("/img/sub/service/air_booster_bg.png") no-repeat center center / cover; }
#product.vacuum-cleaners .more{ background: url("/img/sub/service/vacuum_cleaners_bg.png") no-repeat center center / cover; }


@media screen and (max-width: 1700px){
	#product .slide .btn{ top: -48px; transform: translateX(-50%) translateY(-100%); justify-content: flex-end; gap: 15px; }
	#product .slide .btn button{ top: 0; }
	#product .slide .btn button.prev{ left: 0; transform: translate(0); }
	#product .slide .btn button.next{ right: 0; transform: translate(0) rotate(180deg); }
}

@media screen and (max-width: 1600px){
	#product .care .care-list ul li{ margin-bottom: 120px; }
	#product .care .care-list ul li .text-box > p{ font-size: 2rem; }
	#product .care .care-list ul li .text-box .p-box p{ font-size: 1.8rem; }
	#product .care .care-list ul li .text-box .p-box p .indent{ font-size: 1.6rem; }

	#product .border .text h5{ font-size: 3rem; }
	#product .border .table-box .table h5{ font-size: 1.8rem; }

	#product .guide-box p{ font-size: 2rem; }
	#product .guide-box .dot li{ font-size: 1.8rem; }

	#product .tip .sec-title .mark{ font-size: 2.2rem; }

	#product .slide .content p{ font-size: 1.9rem; }
	#product .slide .btn{ top: -41px; }

	#product .more h4{ font-size: 2.8rem; }
	#product .more h4 strong.big{ font-size: 4rem; }
	#product .more .flex .radius-btn{ max-width: 250px; }
}

@media screen and (max-width: 1540px){
	#product br{ display: none; }
	#product .more br{ display: block; }
}

@media screen and (max-width: 1400px){
	#product .border .inner{ padding: 50px; gap: 30px 80px; }
	#product .border .table-box{ width: calc(100% - 460px); }
}

@media screen and (max-width: 1280px){
	#product .care .care-list ul li{ margin-bottom: 100px; }
	#product .care .care-list ul li .text-box .num{ width: 35px; height: 35px; }
	#product .care .care-list ul li .text-box .sec-title{ margin: 15px 0; }
	#product .care .care-list ul li .text-box > p{ font-size: 1.8rem; }
	#product .care .care-list ul li .text-box .p-box{ margin-top: 30px; }
	#product .care .care-list ul li .text-box .p-box p:not(:last-of-type){ margin-bottom: 5px; }
	#product .care .care-list ul li .text-box .p-box p{ font-size: 1.7rem; }
	#product .care .care-list ul li .text-box .p-box p .indent{ font-size: 1.5rem; margin-top: 7px; }

	#product .border .inner{ gap: 30px 50px; }
	#product .border .table-box{ width: calc(100% - 410px); }
	#product .border .text h5{ font-size: 2.6rem; }
	#product .border .text > p{ font-size: 1.7rem; margin: 10px 0 30px; }
	#product .border .text .p-box p{ font-size: 1.6rem; }
	#product .border .text .p-box p:not(:last-of-type){ margin-bottom: 5px; }
	#product .border .table-box .table:not(:last-of-type){ margin-bottom: 30px; }
	#product .border .table-box .table h5{ font-size: 1.7rem; margin-bottom: 5px; }
	#product .border .table-box > p{ font-size: 1.5rem; margin-top: 10px; }

	.w230{ width: 150px; }
	.w100{ width: 80px; }

	#product .guide-box .sec-title{ margin-bottom: 15px; }
	#product .guide-box p{ font-size: 1.9rem; }
	#product .guide-box > p{ margin-bottom: 20px; }
	#product .guide-box .dot li{ font-size: 1.7rem; }

	#product .tip .sec-title{ margin-bottom: 30px; }
	#product .tip .sec-title .mark{ font-size: 2rem; margin-bottom: 15px; padding: 7px 20px; padding-right: 30px; }

	#product .slide .sec-title{ margin-bottom: 20px; }
	#product .slide .btn{ gap: 10px; top: -20px; }	
	#product .slide .btn button{ width: 45px; height: 45px; }
	#product .slide .slick-list{ margin-right: -20px; }
	#product .slide .content{ margin-right: 20px; }
	#product .slide .content p{ font-size: 1.8rem; margin-top: 5px; }

	#product .more h4{ font-size: 2.4rem; }
	#product .more h4 strong.big{ font-size: 3.5rem; }
	#product .more .flex{ gap: 15px; }
	#product .more .flex .radius-btn{ max-width: 220px; }
}

@media screen and (max-width: 1000px){
	#product .border .inner{ flex-direction: column; gap: 30px 50px; padding: 30px; }
	#product .border .text{ width: 100%; }
	#product .border .table-box{ width: 100%; }

	#product .tip .pc{ display: none; }
	#product .tip .mobile{ display: block; }
}

@media screen and (max-width: 900px){
	#product .care .care-list ul li{ margin-bottom: 80px; }
	#product .care .care-list ul li{ flex-direction: column-reverse; }
	#product .care .care-list ul li .text-box, #product .care .care-list ul li .image-box{ width: 100%; }
	#product .care .care-list ul li .text-box{ padding-right: 0; margin-top: 30px; }
	#product .care .care-list ul li .text-box > p{ font-size: 1.7rem; }
	#product .care .care-list ul li .text-box .p-box p{ font-size: 1.6rem; }

	#product .care .care-list ul li:nth-of-type(even){ flex-direction: column-reverse; }
	#product .care .care-list ul li:nth-of-type(even) .text-box{ padding-left: 0; }

	#product .border .text h5{ font-size: 2.2rem; }
	#product .border .text > p{ font-size: 1.6rem; }
	#product .border .text .p-box p{ font-size: 1.5rem; }

	#product .guide-box p{ font-size: 1.7rem; }
	#product .guide-box .dot li{ font-size: 1.6rem; }

	#product .tip .sec-title .mark{ font-size: 1.6rem; padding: 5px 15px;
    padding-right: 25px; }
	#product .tip dl{ padding: 20px 30px; } 
	#product .tip dl dt{ font-size: 2rem; }
	#product .tip dl dd{ font-size: 1.6rem; }

	#product .slide .btn{ top: -17px; }
	#product .slide .content p{ font-size: 1.7rem; }

	#product .more h4{ font-size: 2.2rem; }
	#product .more h4 strong.big{ font-size: 2.8rem; }
	#product .more .flex .radius-btn{ max-width: 200px; }
}

@media screen and (max-width: 800px){
	#product .more{ padding: 0 0 80% !important; position: relative; }
	#product .more .text{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; padding: 40px 20px; display: flex; flex-direction: column; justify-content: space-between; }
	#product .more .flex{ justify-content: center; }

	/* 제품별 배경이미지 */
	#product.water-purifier .more{ background: url("/img/sub/service/water_purifier_bg_m.jpg") no-repeat center center / cover; }
	#product.ice-purifier-fridge .more{ background: url("/img/sub/service/ice_purifier_fridge_bg_m.jpg") no-repeat center center / cover; }
	#product.air-purifier .more{ background: url("/img/sub/service/air_purifier_bg_m.jpg") no-repeat center center / cover; }
	#product.air-tower .more{ background: url("/img/sub/service/air_tower_bg_m.jpg") no-repeat center center / cover; }
	#product.air-furniture .more{ background: url("/img/sub/service/air_furniture_bg_m.jpg") no-repeat center center / cover; }
	#product.air-conditioner .more{ background: url("/img/sub/service/air_conditioner_bg_m.jpg") no-repeat center center / cover; }
	#product.electric-range .more{ background: url("/img/sub/service/electric_range_bg_m.jpg") no-repeat center center / cover; }
	#product.dishwasher .more{ background: url("/img/sub/service/dishwahser_bg_m.jpg") no-repeat center center / cover; }
	#product.wash-tower .more{ background: url("/img/sub/service/wash_tower_bg_m.jpg") no-repeat center center / cover; }
	#product.washing-machine .more{ background: url("/img/sub/service/washing_machine_bg_m.jpg") no-repeat center center / cover; }
	#product.clothes-dryer .more{ background: url("/img/sub/service/clothes_dryer_bg_m.jpg") no-repeat center center / cover; }
	#product.styler .more{ background: url("/img/sub/service/styler_bg_m.jpg") no-repeat center center / cover; }
	#product.cleaner .more{ background: url("/img/sub/service/cleaner_bg_m.jpg") no-repeat center center / cover; }
	#product.massage-chair .more{ background: url("/img/sub/service/massage_chair_bg_m.jpg") no-repeat center center / cover; }
	#product.plant-living .more{ background: url("/img/sub/service/plant_living_bg_m.jpg") no-repeat center center / cover; }
	#product.fridge .more{ background: url("/img/sub/service/fridge_bg_m.png") no-repeat center center / cover; }
	#product.dehumidifiers .more{ background: url("/img/sub/service/dehumidifiers_bg_m.png") no-repeat center center / cover; }
	#product.humidifiers .more{ background: url("/img/sub/service/humidifiers_bg_m.png") no-repeat center center / cover; }
	#product.ventilation-system .more{ background: url("/img/sub/service/ventilation_system_bg_m.png") no-repeat center center / cover; }
	#product.wash-combo .more{ background: url("/img/sub/service/wash_combo_bg_m.png") no-repeat center center / cover; }
	#product.microwaves-and-ovens .more{ background: url("/img/sub/service/microwaves_and_ovens_bg_m.png") no-repeat center center / cover; }

}

@media screen and (max-width: 600px){
	#product .more{ padding: 0 0 500px !important; }
}


/* 제품별 서비스( 의류건조기 ) */
#product.clothes-dryer .guide-box{ padding: 80px; padding-bottom: 0 !important; }
#product.clothes-dryer .guide-box br{ display: block; }
#product.clothes-dryer .guide-box .flex-box{ display: flex; justify-content: flex-end; align-items: flex-end; gap: 30px 95px; }
#product.clothes-dryer .guide-box .flex-box .figure, #product.clothes-dryer .guide-box .box .phone, #product.clothes-dryer .guide-box .box dl{ max-width: 320px; }
#product.clothes-dryer .guide-box .box{ width: 700px; display: flex; gap: 30px 55px; }
#product.clothes-dryer .guide-box .flex-box .figure{ width: calc(100% - 795px); }
#product.clothes-dryer .guide-box .box .phone{ width: calc((100% - 55px) / 2);  }
#product.clothes-dryer .guide-box .box dl{ background: url("/img/sub/service/phone_back.png") no-repeat bottom center / contain; padding: 80px 45px 30px; text-align: center; }
#product.clothes-dryer .guide-box .box dl dt{ display: flex; flex-direction: column; align-items: center; gap: 20px; font-size: 2rem; font-weight: 700; color: #222; letter-spacing: 0; }
#product.clothes-dryer .guide-box .box dl dt span{ display: inline-block; background: var(--mainColor); border-radius: 990px; font-size: 1.6rem; font-weight: 600; color: #fff; line-height: 1; padding: 10px 20px; }
#product.clothes-dryer .guide-box .box dl dd{ display: flex; flex-wrap: wrap; justify-content: center; align-items: center; min-height: 125px; background: #fff; border-radius: 10px; margin-top: 30px; padding: 15px; margin-bottom: 15px; position: relative; }
#product.clothes-dryer .guide-box .box dl dd::after{ content: url("/img/sub/service/triangle.svg"); position: absolute; bottom: 5px; left: 20px; transform: translateY(100%); }
#product.clothes-dryer .guide-box .box dl dd > div{ font-size: 1.6rem; font-weight: 400; color: #222; line-height: 1.5; }

@media screen and (max-width: 1600px){
	#product.clothes-dryer .guide-box .flex-box{ margin-top: 30px; }
	#product.clothes-dryer .guide-box .box dl dt{ font-size: 1.8rem; }
	#product.clothes-dryer .guide-box .box dl dt span{ padding: 8px 17px; }
}

@media screen and (max-width: 1280px){
	#product.clothes-dryer .guide-box{ padding: 50px; }
	#product.clothes-dryer .guide-box .flex-box{ gap: 30px 50px; }
	#product.clothes-dryer .guide-box .flex-box .figure{ width: calc(100% - 750px); }
	#product.clothes-dryer .guide-box .box dl dt{ font-size: 1.7rem; }
	#product.clothes-dryer .guide-box .box dl dt span{ font-size: 1.5rem; }
	#product.clothes-dryer .guide-box .box dl dd{ margin-top: 15px; }
	#product.clothes-dryer .guide-box .box dl dd > div{ font-size: 1.5rem; }
}

@media screen and (max-width: 1150px){
	#product.clothes-dryer .guide-box .flex-box{ justify-content: center; margin-top: 50px; }
	#product.clothes-dryer .guide-box .flex-box .figure{ display: none; }
}

@media screen and (max-width: 900px){
	#product.clothes-dryer .guide-box{ padding: 30px; }
}

@media screen and (max-width: 750px){
	#product.clothes-dryer .guide-box{ padding-bottom: 30px !important; }
	#product.clothes-dryer .guide-box .box{ flex-direction: column; align-items: center; }
	#product.clothes-dryer .guide-box .box .phone{ max-width: 100%; width: 100%; background: #fff; padding: 50px 30px; padding-bottom: 0; border-radius: 20px; }
	#product.clothes-dryer .guide-box .box dl{ margin: 0 auto; }
	#product.clothes-dryer .guide-box .box dl dd{ width: 90%; margin: 15px auto 0; }
}


/* 제품별 서비스( 청소기 ) */
#product.cleaner .guide-box{ padding: 80px; }
#product.cleaner .guide-box .dot li{ padding-left: 0; }
#product.cleaner .guide-box .dot li::before{ display: none; }
#product.cleaner .guide-box .flex-box{ display: flex; gap: 20px; margin-top: 40px; }
#product.cleaner .guide-box .flex-box .box{ width: calc((100% - 40px) / 3); background: #fff; border-radius: 20px; padding: 25px; padding-top: 50px; text-align: center; }
#product.cleaner .guide-box .flex-box .box span{ display: inline-block; background: var(--mainColor); border-radius: 990px; font-size: 1.8rem; font-weight: 700; color: #fff; line-height: 1; text-transform: uppercase; padding: 11px 35px; }
#product.cleaner .guide-box .flex-box .box p{ font-size: 2rem; font-weight: 600; color: #222; line-height: 1.5; margin: 30px 0; }

@media screen and (max-width: 1600px){
	#product.cleaner .guide-box .flex-box .box span{ font-size: 1.7rem; padding: 10px 30px; }
	#product.cleaner .guide-box .flex-box .box p{ font-size: 1.9rem; }
}

@media screen and (max-width: 1280px){
	#product.cleaner .guide-box{ padding: 50px; }
	#product.cleaner .guide-box .flex-box .box{ padding-top: 40px; }
	#product.cleaner .guide-box .flex-box .box span{ font-size: 1.6rem; padding: 9px 20px; }
	#product.cleaner .guide-box .flex-box .box p{ font-size: 1.8rem; margin: 20px 0; }
}

@media screen and (max-width: 1100px){
	#product.cleaner .guide-box .flex-box .box{ padding: 20px; padding-top: 20px; }
}

@media screen and (max-width: 1000px){
	#product.cleaner .guide-box .flex-box{ flex-direction: column; }
	#product.cleaner .guide-box .flex-box .box{ width: 100%; display: flex; align-items: center; gap: 80px; padding: 20px; }
	#product.cleaner .guide-box .flex-box .box > div{ width: calc((100% - 80px) / 2); }
	#product.cleaner .guide-box .flex-box .box p{ margin-bottom: 0; }
}

@media screen and (max-width: 900px){
	#product.cleaner .guide-box{ padding: 30px; }
	#product.cleaner .guide-box .flex-box .box span{ font-size: 1.5rem; padding: 7px 16px; }
	#product.cleaner .guide-box .flex-box .box p{ font-size: 1.7rem; margin-top: 15px; }
}

@media screen and (max-width: 700px){
	#product.cleaner .guide-box .flex-box .box{ flex-direction: column; gap: 30px; padding: 30px; }
	#product.cleaner .guide-box .flex-box .box > div{ width: 100%; }
	#product.cleaner .guide-box .flex-box .box .figure{ width: 85%; }
}


/* 제품별 서비스( 안마의자 ) */
#product.massage-chair .guide-box .flex-box{ display: flex; }
#product.massage-chair .guide-box .text{ width: 59%; padding: 80px; padding-right: 75px; }
#product.massage-chair .guide-box .text > p{ line-height: 1.6; }
#product.massage-chair .guide-box .dot{ margin-top: 40px; }
#product.massage-chair .guide-box .dot li{ font-size: 1.8rem; color: #888; line-height: 1.6111; }
#product.massage-chair .guide-box .dot li:not(:last-of-type){ margin-bottom: 15px; }  
#product.massage-chair .guide-box .dot li::before{ background: #888; top: calc(1.6111em / 2); }
#product.massage-chair .guide-box .image{ display: flex; justify-content: center; align-items: center; width: 41%; background: #EEE; }
#product.massage-chair .guide-box .txt{ display: flex; justify-content: center; gap: 10px; background: #DDD; padding: 25px; }
#product.massage-chair .guide-box .txt > *{ font-size: 1.9rem; line-height: 1.5789; }
#product.massage-chair .guide-box .txt p{ font-weight: 400; color: #222; }
#product.massage-chair .guide-box .txt span{ font-weight: 700; color: var(--mainColor); }

@media screen and (max-width: 1600px){
	#product.massage-chair .guide-box .dot li{ font-size: 1.7rem; }
	#product.massage-chair .guide-box .txt > *{ font-size: 1.8rem; }
}

@media screen and (max-width: 1280px){
	#product.massage-chair .guide-box .text{ width: 55%; padding: 50px; }
	#product.massage-chair .guide-box .txt{ padding: 15px 20px; }
	#product.massage-chair .guide-box .dot{ margin-top: 20px; }
	#product.massage-chair .guide-box .dot li{ font-size: 1.6rem; }
	#product.massage-chair .guide-box .dot li:not(:last-of-type){ margin-bottom: 10px; }
	#product.massage-chair .guide-box .image{ width: 45%; }
	#product.massage-chair .guide-box .txt > *{ font-size: 1.7rem; }
}

@media screen and (max-width: 1000px){
	#product.massage-chair .guide-box .flex-box{ flex-direction: column; }
	#product.massage-chair .guide-box .text, #product.massage-chair .guide-box .image{ width: 100%; }
	#product.massage-chair .guide-box .image{ padding: 15px; }
	#product.massage-chair .guide-box .image img{ width: 90%; }
}

@media screen and (max-width: 900px){
	#product.massage-chair .guide-box .text{ padding: 30px; }
	#product.massage-chair .guide-box .dot li{ font-size: 1.5rem; }
	#product.massage-chair .guide-box .txt > *{ font-size: 1.6rem; }
}


/* 
	고객지원
*/
/* 고객지원 - 고객 혜택 */
#customer ul li{ display: flex; align-items: center; }
#customer ul li:nth-of-type(even){ flex-direction: row-reverse; }
#customer ul li:not(:last-of-type){ margin-bottom: 60px; }
#customer ul li > div{ width: 50%; }
#customer ul li .figure figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 53%; border-radius: 20px; }
#customer ul li .figure figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#customer ul li .text{ padding: 70px; padding-left: 130px; }
#customer ul li .text span{ font-family: var(--Poppins); font-size: 1.6rem; font-weight: 500; color: var(--mainColor); }
#customer ul li .text h5{ font-size: 3.4rem; font-weight: 700; color: #222; margin-top: 65px; }
#customer ul li .text > p{ font-size: 1.9rem; font-weight: 400; color: #444; line-height: 1.6842; margin-top: 30px; }
#customer ul li .text .ul{ margin-top: 20px; }
#customer ul li .text .ul p{ font-size: 1.7rem; font-weight: 300; color: #777; line-height: 1.8823; padding-left: 15px; position: relative; }
#customer ul li .text .ul p::before{ content: "※"; /* width: 3px; height: 3px; background: #777; border-radius: 50%; */ position: absolute; top: calc(1.8823em / 2); left: 0; transform: translateY(-50%); }
#customer ul li .text .ul p strong{ font-weight: 500; }

@media screen and (max-width: 1600px){ 
	#customer ul li .text h5{ font-size: 2.8rem; margin-top: 50px; }
	#customer ul li .text > p{ font-size: 1.8rem; margin-top: 20px; }
}

@media screen and (max-width: 1500px){ 
	#customer br{ display: none; }
}

@media screen and (max-width: 1280px){	
	#customer ul li .text{ padding: 70px; }
	#customer ul li .text h5{ font-size: 2.4rem; margin-top: 30px; } 	
	#customer ul li .text > p{ font-size: 1.7rem; margin-top: 15px; }
	#customer ul li .text .ul{ margin-top: 15px; }
	#customer ul li .text .ul p{ font-size: 1.6rem; }
}

@media screen and (max-width: 1200px){
	#customer ul li{ flex-direction: column; align-items: center; }
	#customer ul li:nth-of-type(even){ flex-direction: column; }
	#customer ul li > div{ width: 100%; }
	#customer ul li .text{ padding: 0; padding-top: 30px; }
}

@media screen and (max-width: 900px){
	#customer ul li .text span{ font-size: 1.5rem; }
	#customer ul li .text h5{ font-size: 2.2rem; margin-top: 20px; } 	
	#customer ul li .text > p{ font-size: 1.6rem; margin-top: 10px; }
	#customer ul li .text .ul{ margin-top: 10px; }
	#customer ul li .text .ul p{ font-size: 1.5rem; }
}


/* 고객지원 - 연차별 혜택 */
#annual ul{ border-top: 1px solid #DDD; }
#annual ul li{ display: flex; align-items: center; padding: 20px; border-bottom: 1px solid #DDD; }
#annual ul li .figure{ width: 48%; }
#annual ul li .figure figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 51.5%; border-radius: 20px; }
#annual ul li .figure figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#annual ul li .text{ width: 52%; padding-left: 160px; }
#annual ul li .text h3{ font-size: 5rem; font-weight: 700; color: var(--mainColor); margin-bottom: 20px; }
#annual ul li .text h3 span{ font-size: 4rem; font-weight: 600; color: #222; }
#annual ul li .text p{ font-size: 1.9rem; font-weight: 300; color: #777; line-height: 1.6842; }
#annual ul li .text p.bold{ font-size: 2.4rem; font-weight: 600; color: #222; line-height: 1.3333; }

#annual .guide-list{ margin-top: 30px; }
#annual .guide-list p{ font-size: 1.5rem; font-weight: 300; color: #777; line-height: 1.5; position: relative; padding-left: 15px; }
#annual .guide-list p::before{ content: "※"; position: absolute; top: calc(1.5em / 2); left: 0; transform: translateY(-50%); }
#annual .guide-list p:not(:last-of-type){ margin-bottom: 10px; }

@media screen and (max-width: 1600px){
	#annual ul li .text{ padding-left: 120px; }
	#annual ul li .text h3{ font-size: 4rem; }
	#annual ul li .text h3 span{ font-size: 3rem; }
	#annual ul li .text p{ font-size: 1.8rem; }
	#annual ul li .text p.bold{ font-size: 2.2rem; }
}

@media screen and (max-width: 1280px){
	#annual ul li .text{ padding-left: 70px; }
	#annual ul li .text h3{ font-size: 3.5rem; margin-bottom: 10px; }
	#annual ul li .text h3 span{ font-size: 2.6rem; }
	#annual ul li .text p{ font-size: 1.7rem; }
	#annual ul li .text p.bold{ font-size: 2rem; }

	#annual .guide-list{ margin-top: 20px; }  
	#annual .guide-list p:not(:last-of-type){ margin-bottom: 5px; }
}

@media screen and (max-width: 900px){
	#annual ul li .text h3{ font-size: 2.8rem; }
	#annual ul li .text h3 span{ font-size: 2.2rem; }
	#annual ul li .text p{ font-size: 1.6rem; }
	#annual ul li .text p.bold{ font-size: 1.8rem; }
}

@media screen and (max-width: 800px){
	#annual ul li{ flex-direction: column; }
	#annual ul li .figure, #annual ul li .text{ width: 100%; }
	#annual ul li .text{ padding: 30px 0 20px; }
}


/* 고객지원 - 카드 할인 혜택 */
#card .card-list{ display: flex; flex-wrap: wrap; gap: 100px 75px; }
#card .card-list li{ width: calc((100% - 150px) / 3); text-align: center; }
#card .card-list li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 64%; }
#card .card-list li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#card .card-list dl{ margin-top: 60px; }
#card .card-list dl dt{ font-size: 3.4rem; font-weight: 700; color: #222; letter-spacing: 0; margin-bottom: 15px; }
#card .card-list dl dd{ font-size: 1.9rem; font-weight: 400; color: #222; line-height: 1.6842; }

#card .center .radius-btn{ width: 305px; margin: 0 auto; }

@media screen and (max-width: 1600px){
	#card .card-list dl{ margin-top: 40px; }
	#card .card-list dl dt{ font-size: 2.8rem; }
	#card .card-list dl dd{ font-size: 1.8rem; }

	#card .center .radius-btn{ width: 260px; }
}

@media screen and (max-width: 1280px){
	#card .card-list{ gap: 60px; }
	#card .card-list li{ width: calc((100% - 120px) / 3); }
	#card .card-list dl{ margin-top: 20px; }
	#card .card-list dl dt{ font-size: 2.4rem; margin-bottom: 5px; }
	#card .card-list dl dd{ font-size: 1.7rem; }

	#card .center .radius-btn{ width: 220px; }
}

@media screen and (max-width: 1200px){
	#card .card-list{ gap: 60px 40px; }
	#card .card-list li{ width: calc((100% - 80px) / 3); }
}

@media screen and (max-width: 950px){
	#card .card-list li{ width: calc((100% - 40px) / 2); }
}

@media screen and (max-width: 900px){
	#card .card-list dl{ margin-top: 10px; }
	#card .card-list dl dt{ font-size: 2rem; }
	#card .card-list dl dd{ font-size: 1.5rem; }

	#card .center .radius-btn{ width: 180px; }
}

@media screen and (max-width: 600px){
	#card .card-list{ gap: 40px 20px; }
	#card .card-list li{ width: calc((100% - 20px) / 2); }
}

@media screen and (max-width: 500px){
	#card .card-list li{ width: 100%; }
}


/* 고객지원 - 이벤트 */
#event .event-list{ display: flex; flex-wrap: wrap; gap: 90px 45px; }
#event .event-list > li{ width: calc((100% - 90px) / 3); position: relative; }
#event .event-list li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 75%; border-radius: 20px; }
#event .event-list li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#event .event-list li .text{ margin-top: 40px; }
#event .event-list > li span{ display: inline-block; background: var(--mainColor); border-radius: 15px; font-size: 1.6rem; font-weight: 700; color: #fff; line-height: 1; padding: 7px 25px; }
#event .event-list > li span.end{ background: #CCC; padding: 7px 20px; }
#event .event-list > li h6{ font-size: 2.4rem; font-weight: 700; color: #222; margin: 15px 0 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#event .event-list ul{ display: flex; font-family: var(--Poppins); font-size: 1.6rem; font-weight: 300; color: #777; position: relative; padding-left: 30px; }
#event .event-list ul::before{ content:"\e9a4"; font-family: "xeicon"; font-size: 2rem; font-weight: normal; font-style: normal; position: absolute; top: 43%; left: 0; transform: translateY(-50%); }
#event .event-list ul li::after{ content: "~"; margin: 0 3px; }
#event .event-list ul li:last-of-type::after{ display: none; }
#event .event-list > li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 30; }

@media screen and (max-width: 1600px){
	#event .event-list li .text{ margin-top: 30px; }
	#event .event-list > li h6{ font-size: 2.2rem; margin: 15px 0 20px; }
}

@media screen and (max-width: 1280px){
	#event .event-list{ gap: 60px 30px; }
	#event .event-list > li{ width: calc((100% - 60px) / 3); }
	#event .event-list li .text{ margin-top: 20px; }
	#event .event-list > li span{ font-size: 1.5rem; padding: 7px 15px; } 
	#event .event-list > li span.end{ padding: 7px 15px; }
	#event .event-list > li h6{ font-size: 2rem; margin: 10px 0 15px; }
}

@media screen and (max-width: 950px){
	#event .event-list > li{ width: calc((100% - 30px) / 2); }
}

@media screen and (max-width: 900px){
	#event .event-list li .text{ margin-top: 12px; }
	#event .event-list > li h6{ font-size: 1.8rem; }
	#event .event-list ul{ font-size: 1.4rem; padding-left: 23px; }
	#event .event-list ul::before{ font-size: 1.8rem; top: 48%; }
}

@media screen and (max-width: 650px){
	#event .event-list{ gap: 40px 20px; }
	#event .event-list > li{ width: calc((100% - 20px) / 2); }
}


/* 고객지원 - 공지사항 (회사소개 - 공고 복사) */
#notice .notice-list{ display: flex; flex-wrap: wrap; gap: 30px; }
#notice .notice-list > li{ width: calc((100% - 60px) / 3); background: #F1F1F1; border-radius: 20px; padding: 50px; padding-bottom: 40px; position: relative; transition: all 0.5s; }
#notice .notice-list > li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }

#notice .notice-list h5{ width: calc(100% - 30px); height: 3em; font-size: 3rem; font-weight: 600; color: #111; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.5s; }
#notice .notice-list .date{ display: flex; gap: 13px; font-size: 1.8rem; font-weight: 300; color: #111; margin-top: 65px; }
#notice .notice-list li{ transition: all 0.5s; }
#notice .notice-list .date .day{ font-family: var(--Poppins); color: #AAA; }
#notice .notice-list button{ width: 65px; height: 65px; background: #fff; border: none; border-radius: 50%; position: absolute; bottom: 20px; right: 20px; }
#notice .notice-list button::before, #notice .notice-list button::after{ content: ""; width: 17px; height: 1px; background: #000; position: absolute; top: 50%; left: 50%; }
#notice .notice-list button::before{ transform: translate(-50%, -50%); }
#notice .notice-list button::after{ transform: translate(-50%, -50%) rotate(-90deg); }

#notice .notice-list > li:hover{ background: var(--mainColor); }
#notice .notice-list > li:hover h5{ color: #fff; }
#notice .notice-list > li:hover .date li{ color: #fff; }
#notice .notice-list > li:hover .date li.day{ color: rgba(255, 255, 255, 0.5); }

@media screen and (max-width: 1600px){
	#notice .notice-list > li{ padding: 45px; padding-bottom: 40px; }
	#notice .notice-list h5{ font-size: 2.6rem; }
	#notice .notice-list .date{ font-size: 1.7rem; }
	#notice .notice-list button{ width: 60px; height: 60px; }
}

@media screen and (max-width: 1280px){
	#notice .notice-list > li{ padding: 35px; }
	#notice .notice-list h5{ font-size: 2.4rem; }
	#notice .notice-list .date{ font-size: 1.6rem; }
	#notice .notice-list button{ width: 60px; height: 60px; }
}

@media screen and (max-width: 1200px){
	#notice .notice-list{ gap: 20px; }
	#notice .notice-list > li{ width: calc((100% - 40px) / 3); }
	#notice .notice-list h5{ width: 100%; }
}

@media screen and (max-width: 1000px){
	#notice .notice-list > li{ width: calc((100% - 20px) / 2); }
	#notice .notice-list .date{ margin-top: 45px; }
}

@media screen and (max-width: 900px){
	#notice .notice-list > li{ padding: 30px; }
	#notice .notice-list h5{ font-size: 2.2rem; }
	#notice .notice-list .date{ font-size: 1.5rem; }
	#notice .notice-list button{ width: 50px; height: 50px; }
}

@media screen and (max-width: 650px){
	#notice .notice-list > li{ width: 100%; }
	#notice .notice-list .date{ margin-top: 35px; }
	#notice .notice-list button{ width: 45px; height: 45px; }
	#notice .notice-list button::before, #notice .notice-list button::after{ width: 13px; }
}


/* 고객지원 - 제품 사용 팁 */
#usage .radio-box ul{ display: flex; flex-wrap: wrap; gap: 23px 15px; }
#usage .radio-box ul li input{ display: none; }
#usage .radio-box ul li label{ display: inline-block; background: #F5F5F5; border-radius: 35px; padding: 20px 39px; font-size: 2rem; font-weight: 500; color: #222; line-height: 1; cursor: pointer; }
#usage .radio-box ul li input:checked + label{ background: var(--mainColor); color: #fff; }

#usage .search-box .input{ width: 100%; }
#usage .search-box .input input::placeholder{ opacity: 0.5; }

#usage .usage-list{ display: flex; flex-wrap: wrap; gap: 40px 20px; }
#usage .usage-list li{ width: calc((100% - 20px) / 2); display: flex; align-items: center; padding: 10px; border: 1px solid #ddd; border-radius: 20px; position: relative; }
#usage .usage-list li .image{ width: 240px; }
#usage .usage-list li .image figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 92%; border-radius: 10px; margin-bottom: -4px; }
#usage .usage-list li .image figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#usage .usage-list li .text{ width: calc(100% - 240px); padding-left: 40px; padding-right: 20px; }
#usage .usage-list li .text span{ font-size: 1.7rem; font-weight: 500; color: var(--mainColor); }
#usage .usage-list li .text h6{ font-size: 2.4rem; font-weight: 600; color: #222; margin: 5px 0 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#usage .usage-list li .text p{ height: 5.6em; font-size: 1.7rem; font-weight: 300; color: #222; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
#usage .usage-list li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; }

@media screen and (max-width: 1600px){
	#usage .radio-box ul li label{ font-size: 1.8rem; padding: 17px 35px; }

	#usage .usage-list li .text h6{ font-size: 2.2rem; }
}

@media screen and (max-width: 1280px){
	#usage .radio-box ul{ gap: 15px 10px; }
	#usage .radio-box ul li label{ font-size: 1.7rem; padding: 15px 30px; }

	#usage .usage-list li .text{ padding-left: 30px; }
	#usage .usage-list li .text span{ font-size: 1.6rem; }
	#usage .usage-list li .text h6{ font-size: 2rem; margin: 5px 0; }
	#usage .usage-list li .text p{ font-size: 1.6rem; }
}

@media screen and (max-width: 1200px){
	#usage .usage-list li .image{ width: 200px; }
	#usage .usage-list li .text{ width: calc(100% - 200px); }
}

@media screen and (max-width: 950px){
	#usage .usage-list{ gap: 20px; }  
	#usage .usage-list li{ width: 100%; }
	#usage .usage-list li .text{ padding-left: 20px; padding-right: 10px; }
}

@media screen and (max-width: 900px){
	#usage .radio-box ul li label{ font-size: 1.6rem; padding: 13px 18px; }
	#usage .usage-list li .image{ width: 170px; }
	#usage .usage-list li .text{ width: calc(100% - 170px); }
	#usage .usage-list li .text span{ font-size: 1.5rem; }
	#usage .usage-list li .text h6{ font-size: 1.8rem; }
	#usage .usage-list li .text p{ font-size: 1.5rem; }
}


/* 
	인재채용
*/
/* 인재채용 - 인재상 */
#recruit .page-title{ margin-bottom: 100px; }
#recruit .page-title h2{ font-weight: 800; margin-top: 0; }
#recruit .page-title p{ color: var(--mainColor); }
#recruit .page-title p:not(:only-child){ margin-top: 25px; }
#recruit .page-title a{ width: 295px; margin: 0 auto; margin-top: 60px; }

#recruit .recruit-list li{ display: flex; align-items: center; }
#recruit .recruit-list li:nth-of-type(even){ flex-direction: row-reverse; }
#recruit .recruit-list li > div{ width: 50%; }
#recruit .recruit-list li .dl{ padding: 0 130px; }
#recruit .recruit-list li dl dt{ font-family: var(--Poppins); font-size: 6rem; font-weight: 700; color: var(--mainColor); margin-bottom: 35px; }
#recruit .recruit-list li dl dd{ font-size: 2.4rem; font-weight: 300; color: #222; line-height: 1.6; }

#recruit .recruit-list li .image figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 60%; border-radius: 20px; margin-bottom: -4px; }
#recruit .recruit-list li .image figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

@media screen and (max-width: 1600px){
	#recruit .page-title a{ width: 220px; }

	#recruit .recruit-list li .dl{ padding: 0 100px; }
	#recruit .recruit-list li dl dt{ font-size: 5rem; margin-bottom: 20px; }
	#recruit .recruit-list li dl dd{ font-size: 2.2rem; }
}

@media screen and (max-width: 1280px){
	#recruit .page-title p:not(:only-child){ margin-top: 10px; }
	#recruit .page-title a{ width: 180px; margin-top: 30px; }

	#recruit .page-title{ margin-bottom: 60px; }
	#recruit .recruit-list li .dl{ padding: 0 60px; }
	#recruit .recruit-list li dl dt{ font-size: 4rem; margin-bottom: 10px; }
	#recruit .recruit-list li dl dd{ font-size: 2rem; }
}

@media screen and (max-width: 900px){
	#recruit .page-title a{ width: 160px; }

	#recruit .recruit-list li dl dt{ font-size: 3.5rem; }
	#recruit .recruit-list li dl dd{ font-size: 1.8rem; }
}

@media screen and (max-width: 800px){
	#recruit .recruit-list br{ display: none; }
	#recruit .recruit-list li{ flex-direction: column-reverse; }
	#recruit .recruit-list li:nth-of-type(even){ flex-direction: column-reverse; }
	#recruit .recruit-list li:not(:last-of-type){ margin-bottom: 60px; }
	#recruit .recruit-list li > div{ width: 100%; }
	#recruit .recruit-list li .dl{ padding: 0; margin-top: 20px; }
}


/* 인재채용 - 인사제도 */
#system .sec-title:not(.mb70){ margin-bottom: 45px; }
#system .sec-title h3{ margin-bottom: 30px; }
#system .sec-title p{ font-size: 2.2rem; font-weight: 400; color: #666; line-height: 1.6; }
#system .sec-title p.dot{ padding-left: 30px; position: relative; }
#system .sec-title p.dot::before{ content: ""; width: 5px; height: 5px; background: #666; border-radius: 50%; position: absolute; top: calc(1.6em / 2); left: 10px; transform: translateY(-50%); }

#system .rank ul{ display: flex; gap: 170px; justify-content: center; }
#system .rank ul li{ max-width: 308px; width: calc((100% - 340px) / 3); position: relative; padding: 34px; border-radius: 50%; border: 1px dashed #D9D9D9; }
#system .rank ul li::after{ content: ""; width: 40px; height: 40px; background: #fff url("/img/sub/recruit/system_arrow.svg") no-repeat center center / auto; border: 1px solid #DDD; position: absolute; top: 50%; right: -85px; transform: translate(50%, -50%); border-radius: 50%; }
#system .rank ul li:last-of-type::after{ display: none; }
#system .rank ul li .circle{ width: 100%; padding-bottom: 100%; border-radius: 50%; position: relative; }
#system .rank ul li .circle::after{ content: ""; width: 300px; height: 1px; background: #DDD; position: absolute; top: 50%; right: 0; transform: translate(100%, -50%); }
#system .rank ul li:last-of-type .circle::after{ display: none; }
#system .rank ul li span{ font-size: 3.4rem; font-weight: 700; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#system .rank ul li span.black{ color: #222; }

#system .price ul{ display: flex; gap: 45px; }
#system .price ul li{ width: calc((100% - 90px) / 3); background: #F5F5F5; border-radius: 20px; padding: 55px 30px 45px; text-align: center; position: relative; }
#system .price ul li::after{ content: ""; width: 100px; height: 100px; background: #fff url("/img/sub/recruit/plus_icon.svg") no-repeat center center / auto; border: 1px solid #DDD; border-radius: 50%; position: absolute; top: 50%; right: -25.5px; transform: translate(50%, -50%); z-index: 20; }
#system .price ul li:last-of-type::after{ display: none; }
#system .price dl dt{ font-size: 3.4rem; font-weight: 700; color: #222; margin: 20px 0 15px; }
#system .price dl dd{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.4; }

#system .welfare ul{ display: flex; flex-wrap: wrap; gap: 40px; }
#system .welfare ul li{ width: calc((100% - 40px) / 2); padding: 60px; border: 1px solid #DDD; border-radius: 20px; }
#system .welfare ul li .title{ display: flex; align-items: center; margin-bottom: 30px; }
#system .welfare ul li .title .icon{ display: flex; justify-content: center; align-items: center; width: 100px; height: 100px; background: #F5F5F5; border-radius: 50%; }
#system .welfare ul li .title h6{ width: calc(100% - 100px); font-size: 3.4rem; font-weight: 700; color: var(--mainColor); padding-left: 20px; }
#system .welfare .dl dl:not(:last-of-type){ margin-bottom: 30px; }
#system .welfare dl{ padding-left: 45px; }
#system .welfare dl dt{ font-size: 2.4rem; font-weight: 600; color: #222; margin-bottom: 10px; position: relative; }
#system .welfare dl dt::before{ content: attr(data-num); width: 30px; height: 30px; background: var(--mainColor); border-radius: 50%; display: flex; justify-content: center; align-items: center; font-family: var(--Poppins); font-size: 1.2rem; font-weight: 700; color: #fff; line-height: 1; position: absolute; top: 15px; left: -45px; transform: translateY( -50%); }
#system .welfare dl dd{ font-size: 1.7rem; font-weight: 400; color: #666; line-height: 1.5; }

@media screen and (max-width: 1600px){
	#system .sec-title p{ font-size: 2rem; }

	#system .rank ul li span{ font-size: 2.8rem; }

	#system .price dl dt{ font-size: 2.8rem; }
	#system .price dl dd{ font-size: 1.8rem; }

	#system .welfare ul li .title h6{ font-size: 2.8rem; }
	#system .welfare dl dt{ font-size: 2.2rem; }
}

@media screen and (max-width: 1280px){
	#system .sec-title:not(.mb70){ margin-bottom: 30px; }
	#system .sec-title h3{ margin-bottom: 15px; }
	#system .sec-title p{ font-size: 1.8rem; }

	#system .rank ul{ gap: 120px; }
	#system .rank ul li{ width: calc((100% - 240px) / 3); }
	#system .rank ul li::after{ right: -60px; }
	#system .rank ul li span{ font-size: 2.4rem; }

	#system .price ul li{ padding: 35px 30px 25px; }
	#system .price ul li::after{ width: 80px; height: 80px; }
	#system .price dl dt{ font-size: 2.4rem; margin: 15px 0 10px; }
	#system .price dl dd{ font-size: 1.7rem; }

	#system .welfare ul li{ padding: 40px; }
	#system .welfare ul li .title .icon{ width: 80px; height: 80px; }
	#system .welfare ul li .title h6{ width: calc(100% - 80px); font-size: 2.4rem; }
	#system .welfare .dl dl:not(:last-of-type){ margin-bottom: 20px; }
	#system .welfare dl dt{ font-size: 2rem; }
	#system .welfare dl dd{ font-size: 1.6rem; }
}

@media screen and (max-width: 1200px){
	#system .rank ul li{ padding: 20px; }
	#system .rank ul li::after{ width: 30px; height: 30px; }

	#system .welfare ul{ gap: 20px; }
	#system .welfare ul li{ width: calc((100% - 20px) / 2); }
}

@media screen and (max-width: 1000px){
	#system .rank ul{ gap: 80px; }
	#system .rank ul li{ width: calc((100% - 160px) / 3); }
	#system .rank ul li::after{ right: -40px; }
	#system .rank ul li .circle::after{ width: 200px; }

	#system .price ul{ gap: 20px; }
	#system .price ul li{ width: calc((100% - 40px) / 3); }
	#system .price ul li::after{ width: 60px; height: 60px; right: -10px; }

	#system .welfare ul li{ width: 100%; } 
	#system .welfare ul li{ padding: 25px; }
}

@media screen and (max-width: 900px){
	#system .sec-title p{ font-size: 1.7rem; }

	#system .rank ul li span{ font-size: 2.2rem; }

	#system .price dl dt{ font-size: 2.2rem; }
	#system .price dl dd{ font-size: 1.6rem; }
	#system .price ul{ flex-wrap: wrap; justify-content: center; }
	#system .price ul li{ width: calc((100% - 20px) / 2); }
	#system .price ul li::after{ top: calc(100% + 10px); transform: translate(50%, -50%); }
	#system .price ul li:nth-of-type(even)::after{ display: none; }

	#system .welfare ul li .title h6{ font-size: 2.2rem; }
	#system .welfare dl dt{ font-size: 1.8rem; }
}

@media screen and (max-width: 800px){
	#system .rank ul{ flex-direction: column; align-items: center; }
	#system .rank ul li{ max-width: 200px; width: 100%; }
	#system .rank ul li .circle::after{ width: 1px; height: 200px; top: 100%; right: 50%; transform: translateX(-50%); }
	#system .rank ul li::after{ top: calc(100% + 40px); right: 50%; transform: translate(50%, -50%) rotate(90deg); }
}

@media screen and (max-width: 600px){
	#system .price ul li{ display: flex; align-items: center; gap: 20px; width: 100%; padding: 40px 30px; }
	#system .price ul li::after{ width: 50px; height: 50px; right: 50%; transform: translate(50%, -50%); }
	#system .price ul li:nth-of-type(even)::after{ display: block; }
	#system .price .icon{ width: 100px; }
	#system .price dl{ width: calc(100% - 100px); }
	#system .price dl dt{ margin-top: 0; }
}


/* 인재채용 - 인사제도 */
#step .page-title{ margin-bottom: 100px; }
#step .page-title h2{ font-weight: 800; margin-top: 0; }
#step .page-title p{ color: var(--mainColor); }
#step .page-title p:not(:only-child){ margin-top: 25px; }
#step .page-title a{ width: 215px; margin: 0 auto; margin-top: 60px; }

#step .step ul{ display: flex; }
#step .step ul li{ width: calc(100% / 6); text-align: center; position: relative; padding: 9px 9px 0; }
#step .step ul li .circle{ width: 100%; padding-bottom: 100%; background: #F5F5F5; border-radius: 50%; position: relative; z-index: 10; }
#step .step ul li .circle::before{ content: ""; width: calc(100% + 18px); height: calc(100% + 18px); background: url("/img/sub/recruit/circle.svg") no-repeat top center / contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#step .step ul li:nth-of-type(even) .circle::before{ width: calc(100% + 21px); height: calc(100% + 21px); transform: translate(-50%, -50%) rotate(180deg); }
#step .step ul li .circle::after{ content: url("/img/sub/recruit/step_after.svg"); position: absolute; top: 50%; right: -19px; transform: translate(-50%, -50%); }
#step .step ul li:nth-of-type(odd) .circle::after{ right: -17px; transform: translate(-50%, -50%) rotate(180deg); }
#step .step ul li:last-of-type .circle::after{ display: none; }

#step .step ul li .text{ width: 100%; position: absolute; top: 50%; left: 50%; z-index: 10; transform: translate(-50%, -50%); padding: 0 20px; }
#step .step ul li .text h6{ font-size: 2.4rem; font-weight: 700; color: #222; margin-top: 35px; position: relative; }
#step .step ul li .text span{ display: inline-block; font-size: 1.6rem; font-weight: 400; color: #222; padding-top: 5px; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 100%); } 
#step .step ul li .text::after{ content: ""; width: 10px; height: 10px; background: var(--mainColor); border-radius: 50%; position: absolute; top: 50%; }
#step .step ul li:first-of-type .text::after{ left: -18px; transform: translate(50%, -50%); }
#step .step ul li:not(:first-of-type) .text::after{ right: -20px; transform: translate(-50%, -50%); }
#step .step ul li:not(:first-of-type, :last-of-type) .text::after{ display: none; }

#step .step ul li .box{ padding-top: 75px; position: relative; }
#step .step ul li .box::before{ content: url("/img/sub/recruit/step_arrow.svg"); position: absolute; top: 28px; left: 50%; transform: translateX(-50%); }
#step .step ul li .box p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.4; }
#step .step ul li .box p strong{ font-weight: 600; color: #222; }
#step .step ul li .box span{ display: inline-block; font-size: 1.6rem; font-weight: 400; color: var(--mainColor); margin-top: 7px; }

#step .step ul li.last .circle{ background: var(--mainColor); }
#step .step ul li.last h6{ color: #fff; }

#step .warn ul li{ font-size: 2.2rem; font-weight: 400; color: #666; line-height: 1.6; padding-left: 30px; position: relative; }
#step .warn ul li::before{ content: ""; width: 5px; height: 5px; background: #666; border-radius: 50%; position: absolute; top: calc(1.6em / 2); left: 10px; transform: translateY(-50%); }

@media screen and (max-width: 1600px){
	#step .page-title a{ width: 180px; }

	#step .step ul li .text h6{ font-size: 2.2rem; margin-top: 20px; }
	#step .step ul li .box p{ font-size: 1.8rem; }

	#step .warn ul li{ font-size: 2rem; }
}

@media screen and (max-width: 1500px){
	#step .step ul{ max-width: calc(308px * 3); flex-wrap: wrap; margin: 0 auto; gap: 60px 0; }
	#step .step ul li{ max-width: 308px; width: calc(100% / 3); }
	#step .step ul li:nth-of-type(3n) .text::after{ display: block; right: -18px; }
	#step .step ul li:nth-of-type(4n) .text::after{ display: block; right: 100%; }
	#step .step ul li:last-of-type .text::after{ right: -19px; }
}

@media screen and (max-width: 1280px){
	#step .page-title{ margin-bottom: 60px; }
	#step .page-title p:not(:only-child){ margin-top: 10px; }
	#step .page-title a{ width: 140px; margin-top: 30px; }

	#step .step ul li .text h6{ font-size: 2rem; margin-top: 20px; }
	#step .step ul li .text span{ font-size: 1.5rem; }
	#step .step ul li .box p{ font-size: 1.7rem; }
	#step .step ul li .box span{ font-size: 1.5rem; }

	#step .warn ul li{ font-size: 1.8rem; }
}

@media screen and (max-width: 900px){
	#step .page-title a{ width: 120px; }
	#step .sec-title.mb70{ margin-bottom: 20px; }

	#step .step ul li .text h6{ font-size: 1.8rem; }
	#step .step ul li .box p{ font-size: 1.6rem; }
}

@media screen and (max-width: 750px){
	#step .step ul li .text h6{ margin-top: 10px; }
}

@media screen and (max-width: 650px){
	#step .step ul li{ width: calc(100% / 2); }
	#step .step ul li .circle::after{ right: -18px; }
	#step .step ul li:nth-of-type(odd) .circle::after{ right: -16px; }
	#step .step ul li:nth-of-type(even) .text::after{ display: block; right: -19px; }
	#step .step ul li:nth-of-type(odd) .text::after{ display: block; right: calc(100% - 1px); }

	#step .warn ul li{ font-size: 1.7rem; }
}


/* 케어 매니저 - 케어 매니저 */
#manager .sec-title{ margin-bottom: 45px; }

#manager .intro .flex-box{ display: flex; }
#manager .intro .tit{ width: 430px; }
#manager .intro .text{ width: calc(100% - 430px); }
#manager .intro .text p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.6684; }

#manager .part ul{ display: flex; gap: 30px; }
#manager .part ul li{ width: calc((100% - 60px) / 3); }
#manager .part ul li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 63%; border-radius: 20px; }
#manager .part ul li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#manager .part dl{ text-align: center; margin-top: 35px; }
#manager .part dl dt{ font-size: 2.4rem; font-weight: 700; color: #111; margin-bottom: 10px; }
#manager .part dl dd{ font-size: 1.9rem; font-weight: 400; color: #666; }

#manager .benefit .sec-title h3{ margin-bottom: 30px; }
#manager .benefit .sec-title p{ font-size: 2.2rem; font-weight: 400; color: #666; }
#manager .benefit .sec-title span{ display: block; font-size: 1.6rem; font-weight: 400; color: #666; opacity: 1; margin-top: 10px; }

#manager .benefit ul{ display: flex; flex-wrap: wrap; gap: 20px; }
#manager .benefit ul li{ display: flex; align-items: center; width: calc((100% - 20px) / 2); padding: 60px 50px; border: 1px solid #E7E7E7; border-radius: 20px; }
#manager .benefit ul li .icon{ display: flex; justify-content: center; align-items: center; width: 110px; height: 110px; background: #F8F8F8; border-radius: 50%; }
#manager .benefit ul li dl{ width: calc(100% - 110px); padding-left: 35px; }
#manager .benefit ul li dl dt{ font-size: 2.5rem; font-weight: 600; color: #222; margin-bottom: 20px; }
#manager .benefit ul li dl dd{ font-size: 1.7rem; font-weight: 400; color: #666; padding-left: 25px; position: relative; }
#manager .benefit ul li dl dd::before{ content: ""; width: 3px; height: 3px; background: #666; border-radius: 50%; position: absolute; top: calc(1.3em / 2); left: 10px; transform: translateY(-50%); }
#manager .benefit ul li dl dd:not(:last-of-type){ margin-bottom: 10px; } 

#manager .step ul{ display: flex; gap: 88px; }
#manager .step ul li{ width: calc((100% - 352px) / 5); text-align: center; }
#manager .step ul li .circle{ width: 100%; padding-bottom: 100%; background: #F5F5F5; border-radius: 50%; position: relative; }
#manager .step ul li .circle::before{ content: ""; width: 100px; height: 1px; border-bottom: 1px dashed #DDD; position: absolute; top: 50%; right: 0; transform: translate(100%, -50%); }
#manager .step ul li .circle::after{ content: ""; width: 40px; height: 40px; background: #fff url("/img/sub/manager/step_arrow.svg") no-repeat center center / auto; border: 1px solid #DDD; border-radius: 50%; position: absolute; top: 50%; right: -44px; transform: translate(50% , -50%); }
#manager .step ul li:last-of-type .circle::before, #manager .step ul li:last-of-type .circle::after{ display: none; }
#manager .step ul li .text{ position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); padding: 0 20px; }
#manager .step ul li .text h6{ display: flex; justify-content: center; align-items: center; min-height: 2.6em; font-size: 2.4rem; font-weight: 700; color: #222; margin-top: 20px; }
#manager .step ul li .box{ padding-top: 75px; position: relative; }
#manager .step ul li .box::before{ content: url("/img/sub/manager/step_arrow02.svg"); position: absolute; top: 30px; left: 50%; transform: translateX(-50%); }
#manager .step ul li .box p{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.4; }
#manager .step ul li .box p strong{ font-weight: 600; color: #222; }
#manager .step ul li .box p em{ color: var(--mainColor); }

#manager .step .iframe-box{ max-width: 1000px; margin: 0 auto; margin-top: 110px; }
#manager .step .iframe{ position: relative; overflow: hidden; padding-bottom: 55.1%; border-radius: 20px; }
#manager .step .iframe img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#manager .step .iframe iframe{ width: 100%; height: 100%; position: absolute; }

#manager .center{ margin-top: 60px; }
#manager .center a{ width: 385px; margin: 0 auto; }

@media screen and (max-width: 1600px){
	#manager .intro .text p{ font-size: 1.8rem; }

	#manager .part dl{ margin-top: 25px; }
	#manager .part dl dt{ font-size: 2.2rem; }
	#manager .part dl dd{ font-size: 1.8rem; }

	#manager .benefit .sec-title p{ font-size: 2rem; }
	#manager .benefit ul li dl dt{ font-size: 2.2rem; }

	#manager .step ul li .text h6{ font-size: 2.2rem; margin-top: 10px; }
	#manager .step ul li .box p{ font-size: 1.8rem; }
	#manager .step .iframe-box{ margin-top: 80px; }

	#manager .center a{ width: 330px; }
}

@media screen and (max-width: 1400px){
	#manager .step ul{ gap: 50px; }
	#manager .step ul li{ width: calc((100% - 200px) / 5); }
	#manager .step ul li .circle::after{ width: 30px; height: 30px; right: -25px; }
}

@media screen and (max-width: 1280px){
	#manager .sec-title{ margin-bottom: 20px; }

	#manager .intro .tit{ width: 350px; }
	#manager .intro .text{ width: calc(100% - 350px); }
	#manager .intro .text p{ font-size: 1.7rem; }

	#manager .part dl{ margin-top: 15px; }
	#manager .part dl dt{ font-size: 2rem; margin-bottom: 5px; }
	#manager .part dl dd{ font-size: 1.7rem; }

	#manager .benefit .sec-title p{ font-size: 1.8rem; }
	#manager .benefit .sec-title span{ margin-top: 5px; }
	#manager .benefit ul li{ padding: 40px 30px; }
	#manager .benefit ul li dl dt{ font-size: 2rem; }
	#manager .benefit ul li dl dd{ font-size: 1.6rem; }

	#manager .step ul li .text h6{ font-size: 2rem; }
	#manager .step ul li .box p{ font-size: 1.7rem; }
	#manager .step .iframe-box{ margin-top: 60px; }

	#manager .center{ margin-top: 30px; }
	#manager .center a{ width: 300px; }
}

@media screen and (max-width: 1200px){
	#manager .benefit ul li{ flex-direction: column; align-items: flex-start; }
	#manager .benefit ul li .icon{ width: 90px; height: 90px; padding: 20px; }
	#manager .benefit ul li dl{ width: 100%; padding-left: 0; padding-top: 20px; }

	#manager .step ul{ max-width: 760px; flex-wrap: wrap; justify-content: center; margin: 0 auto; }
	#manager .step ul li{ max-width: 220px; width: calc((100% - 100px) / 3); }
	#manager .step ul li:nth-of-type(3n) .circle::before{ display: none; } 
	#manager .step ul li:nth-of-type(3n) .circle::after{ display: none; } 
	#manager .step ul li .box{ padding-top: 60px; }
	#manager .step ul li .box::before{ top: 20px; }
}

@media screen and (max-width: 1000px){
	#manager .intro .flex-box{ flex-direction: column; }
	#manager .intro .tit{ width: 100%; }
	#manager .intro .text{ width: 100%; }

	#manager .part ul{ flex-wrap: wrap; }
	#manager .part ul li{ width: calc((100% - 30px) / 2); }

	#manager .benefit ul li{ padding: 30px 20px; }
}

@media screen and (max-width: 900px){
	#manager .part dl dt{ font-size: 1.8rem; }
	#manager .part dl dd{ font-size: 1.6rem; }

	#manager .benefit .sec-title p{ font-size: 1.7rem; }
	#manager .benefit .sec-title span{ font-size: 1.5rem; }
	#manager .benefit ul li dl dt{ font-size: 1.8rem; }

	#manager .step ul li .text h6{ font-size: 1.8rem; }

	#manager .center a{ width: 270px; }
}

@media screen and (max-width: 820px){
	#manager .benefit ul li{ width: 100%; }
}

@media screen and (max-width: 700px){
	#manager .part ul{ gap: 30px 20px; }
	#manager .part ul li{ width: calc((100% - 20px) / 2); }

	#manager .step ul li{ width: calc((100% - 50px) / 2); }
	#manager .step ul li:nth-of-type(3n) .circle::before{ display: block; } 
	#manager .step ul li:nth-of-type(3n) .circle::after{ display: block; } 
	#manager .step ul li:nth-of-type(2n) .circle::before{ display: none; } 
	#manager .step ul li:nth-of-type(2n) .circle::after{ display: none; } 
}

@media screen and (max-width: 600px){
	#manager br{ display: none; }
	#manager .step ul li .text h6{ min-height: auto; }
}


/* 
	신청폼
*/
/* 공통 */
#register .sec-title{ margin-bottom: 20px; }
#register p.color{ font-size: 1.5rem; font-weight: 300; color: var(--mainColor); line-height: 1.3333; margin-bottom: 20px; text-align: right; }

#register span{ font-size: 1.7rem; font-weight: 300; color: #666; }
#register .line{ margin-bottom: 20px; }
#register .flex{ display: flex; align-items: center; gap: 20px; }
#register .flex > div{ width: calc((100% - 20px) / 2); }
#register .box{ display: flex; align-items: center; padding: 20px 30px; }
#register .border{  border: 1px solid #EAEAEA !important; border-radius: 10px !important; }

#register .tit{ display: inline-block; width: 115px; font-size: 2rem; font-weight: 600; color: #222; position: relative; }
#register .tit::before{ content: ""; width: 1px; height: 15px; background: #D9D9D9; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#register .tit.required::after{ content: "*"; display: inline-block; color: var(--mainColor); margin-left: 5px; }
#register .tit .color{ color: var(--mainColor); }

#register .input{ display: flex; flex-wrap: wrap; width: calc(100% - 115px); padding-left: 25px; }
#register input, #register select, #register textarea{ width: 100%; height: 50px; border: none; outline: none; font-family: var(--baseFont); font-size: 1.7rem; font-weight: 300; color: #111; appearance: none; -webkit-appearance: none; border-radius: 5px; -webkit-border-radius: 5px; }
#register input::placeholder, #register textarea::placeholder{ color: #999; }
#register input.border, #register select.border{ padding: 0 20px; border-radius: 5px !important; -webkit-border-radius: 5px !important; }
#register select{ background: url("/img/sub/service/register_select_icon.svg") no-repeat center right 15px / auto; color: #999; }
#register select option{ color: #111; }
#register textarea{ width: 100%; height: 330px !important; resize: none; }

#register .line button{ width: 180px; height: 50px; display: flex; justify-content: space-between; align-items: center; background: var(--mainColor); border: none; appearance: none; -wekit-appearance: none; border-radius: 5px; -webkit-border-radius: 5px; padding: 0 25px; font-family: var(--baseFont); font-size: 1.7rem; font-weight: 500; color: #fff; }

#register .radio{ display: flex; flex-wrap: wrap; gap: 10px 40px; }
#register .radio li input{ display: none; }
#register .radio li label{ display: inline-block; font-size: 1.7rem; font-weight: 300; color: #333; padding: 13px 30px; padding-right: 0; position: relative; cursor: pointer; }
#register .radio li label::before{ content: ""; width: 20px; height: 20px; border: 1px solid #EAEAEA; border-radius: 50%; position: absolute; top: 13px; left: 0; box-sizing: border-box; }
#register .radio li input:checked + label::before{ border: 1px solid var(--mainColor); }
#register .radio li input:checked + label::after{ content: ""; width: 6px; height: 6px; background: var(--mainColor); border-radius: 50%; position: absolute; top: 23px; left: 10px; transform: translate(-50%, -50%); }

#register dl{ width: 100%; }
#register dl *{ font-size: 1.5rem; color: #666; line-height: 1.8666; }
#register dl dt{ font-weight: 500; margin-bottom: calc(1.8666em / 2); }
#register dl dd{ font-weight: 300; }
#register dl dd:not(:last-of-type){ margin-bottom: calc(1.8666em / 2); }
#register dl strong{ font-size: 1.55rem; font-weight: 600; color: #222; }
#register .table-box{ margin-top: 5px; }
#register .table-box table th, #register .table-box table td{ padding: 5px; }

#register .max65{ width: 65px !important; }
#register .max65 + div{ width: calc(100% - 65px); }

#register .max310{ display: flex; align-items: center; gap: 20px; max-width: 310px !important; }
#register .max310 input{ width: calc((100% - 50px) / 2); }

#register .column{ flex-direction: column; gap: 25px; }
#register .column .tit{ width: 100% !important; }
#register .column .tit::before{ display: none; }

.gap15{ gap: 15px !important; }

#register .right{ display: flex; justify-content: flex-end; text-align: right; }
#register .right input{ display: none; }
#register .right label{ display: inline-block; padding: 0 30px; font-size: 1.7rem; font-weight: 400; color: #222; position: relative; cursor: pointer; }
#register .right label::before{ content: ""; width: 15px; height: 15px; border: 1px solid #CCC; border-radius: 2px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#register .right input:checked + label::before{ background: #CCC; }
#register .right input:checked + label::after{ content: "\e928"; font-family: "xeicon"; font-size: 1.3rem; font-weight: normal; font-style: normal; color: #fff; position: absolute; top: 50%; left: 2px; transform: translateY(-50%); }

#register .center{ display: flex; justify-content: center; gap: 25px; margin-top: 90px; }
#register .center .radius-btn{ width: 190px; }

@media screen and (max-width: 1600px){
	#register .tit{ font-size: 1.8rem; }

	#register .center .radius-btn{ width: 150px; }
}

@media screen and (max-width: 1280px){
	#register p.color{ margin-bottom: 10px; }

	#register .box{ padding: 10px 15px; }

	#register .tit{ width: 95px; font-size: 1.7rem; }
	#register .input{ width: calc(100% - 95px); padding-left: 15px; }
	
	#register input, #register select, #register textarea{ height: 45px; font-size: 1.6rem; }
	#register input.border, #register select.border{ padding: 0 15px; }
	#register textarea{ height: 250px !important; }
	#register .line button{ height: 45px; font-size: 1.6rem; }

	#register .radio{ gap: 10px 20px; }
	#register .radio li label{ padding: 11px 30px; padding-right: 0; }

	#register .max310{ gap: 15px; }
	#register .max310 input{ width: calc((100% - 30px) / 2); }

	#register .column{ padding: 15px; gap: 15px; }

	#register .right label{ font-size: 1.6rem; padding-left: 25px; padding-right: 15px; }
	#register .right label::before{ top: 45%; }
	
	#register .center{ gap: 15px; margin-top: 50px; }
	#register .center .radius-btn{ width: 130px; }
}

@media screen and (max-width: 1000px){
	#register .box{ flex-direction: column; align-items: flex-start; gap: 10px; padding: 15px; }
	#register .tit{ width: 100%; }
	#register .tit::before{ display: none; }
	#register .input{ width: 100%; padding-left: 0; gap: 15px; }
	#register input, #register select, #register textarea{ padding: 10px; border: 1px solid #EAEAEA !important; }
	#register select{ background-position: center right 10px; }

	#register .max65{ width: 85px !important; }
	#register .max65 + div{ width: calc(100% - 100px); }
}

@media screen and (max-width: 800px){
	#register .flex{ flex-wrap: wrap; flex-direction: column; }
	#register .flex > div{ width: 100%; }
	#register .box .flex{ flex-direction: row; }
}

@media screen and (max-width: 500px){
	#register .only .max310{ max-width: 100% !important; width: 100%; }
}


/* 신청폼 - 케어 매니저 */
#register.manager .tit{ width: 135px; }
#register.manager .input{ width: calc((100% - 135px)); }

@media screen and (max-width: 1440px){
	#register.manager .line button{ width: 150px; padding: 0 20px; }
}

@media screen and (max-width: 1400px){
	#register.manager .email input, #register.manager .email select{ width: calc((100% - 60px) / 3); }
	#register.manager .area input{ width: calc((100% - 195px) / 3); }
}

@media screen and (max-width: 1000px){
	#register.manager .tit{ width: 100%; }
	#register.manager .input{ width: 100%; }  
}

@media screen and (max-width: 800px){
	#register.manager .email input, #register.manager .email select{ max-width: 100% !important; }
	#register.manager .email input{ width: calc((100% - 45px) / 2); }
	#register.manager .email select{ width: 100%; }

	#register.manager .area input, #register.manager .area button{ max-width: 100% !important; width: calc((100% - 15px) / 2); }
}


/* 
	상세 페이지
*/
#view .tit-box{ padding: 0 50px; border-top: 1px solid #000; border-bottom: 1px solid #EEE; }
#view .tit-box h4{ font-size: 4rem; font-weight: 600; color: #222; line-height: 1.5; }
#view .content-box{ padding: 40px 50px; font-size: 1.7rem; }
#view .link-box table *{ font-size: 1.8rem; color: #111; }
#view .link-box tr{ border-bottom: 1px solid #EEE; }
#view .link-box tr:first-of-type{ border-top: 1px solid #EEE; }
#view .link-box th, #view .link-box td{ position: relative; }
#view .link-box th{ width: 190px; font-weight: 600; }
#view .link-box th::after{ content: ""; width: 1px; height: 15px; background: #DDD; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#view .link-box th img{ margin-left: 25px; vertical-align: middle; position: relative; top: -2px; }
#view .link-box tr:last-of-type th img{ top: -1px; }
#view .link-box td{ padding: 30px 40px; }
#view .link-box td p{ font-weight: 300; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view .link-box td a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }

#view .link-box td.none p{ color: #999; }

#view .center a{ display: flex; justify-content: center; align-items: center; width: 265px; height: 70px; background: #191919; border-radius: 10px; font-size: 2rem; font-weight: 700; color: #fff; text-align: center; margin: 0 auto; }

/* 상세 페이지 - 날짜 */
#view .tit-box .date{ display: flex; gap: 13px; }
#view .tit-box .date li{ font-size: 1.8rem; font-weight: 300; color: #111; }
#view .tit-box .date li:last-of-type{ font-family: var(--Poppins); color: #AAA; }

/* 상세 페이지 - 첨부파일 */
#view .tit-box .file li{ display: flex; align-items: center; gap: 10px; position: relative; }
#view .tit-box .file li:not(:last-of-type){ margin-bottom: 10px; }
#view .tit-box .file li::before{ content: ""; display: inline-block; width: 35px; height: 35px; background: url("/img/sub/clip_icon.svg") no-repeat center center / contain; }
#view .tit-box .file li a{ max-width: calc(100% - 50px); display: inline-block; font-size: 1.6rem; font-weight: 400; color: #777; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-bottom: 3px; border-bottom: 1px solid #AAA; }

@media screen and (max-width: 1600px){
	/* 상세 페이지 */
	#view .tit-box h4{ font-size: 3.5rem; }
	#view .link-box table *{ font-size: 1.7rem; }
	#view .link-box th{ width: 180px; }
	#view .center a{ font-size: 1.8rem; width: 210px; height: 60px; }

	/* 상세 페이지 - 날짜 */
	#view .tit-box .date li{ font-size: 1.7rem; }
}

@media screen and (max-width: 1280px){
	/* 상세 페이지 */
	#view .tit-box{ padding: 0 30px; }
	#view .tit-box h4{ font-size: 2.8rem; }
	#view .content-box{ padding: 30px; }
	#view .link-box th, #view .link-box td{ font-size: 1.6rem; }
	#view .link-box th{ width: 130px; }
	#view .link-box td{ padding: 25px; }
	#view .link-box th img{ margin-left: 10px; }
	#view .center a{ font-size: 1.7rem; width: 180px; height: 55px; }

	/* 상세 페이지 - 첨부파일 */
	#view .tit-box .file li::before{ width: 30px; height: 30px; }
}

@media screen and (max-width: 900px){
	#view .tit-box{ padding: 0 20px; }
	#view .tit-box h4{ font-size: 2.4rem; }
	#view .content-box{ padding: 30px 20px; }
	#view .link-box table *{ font-size: 1.5rem; }
	#view .link-box th{ width: 105px; }
	#view .link-box td{ padding: 20px 25px; }
	#view .center a{ font-size: 1.6rem; width: 150px; height: 50px; }

	/* 상세 페이지 - 날짜 */
	#view .tit-box .date{ gap: 7px; }
	#view .tit-box .date li{ font-size: 1.6rem; }

	/* 상세 페이지 - 첨부파일 */
	#view .tit-box .file li{ gap: 7px; }
	#view .tit-box .file li::before{ width: 25px; height: 25px; }
	#view .tit-box .file li a{ font-size: 1.5rem; padding: 3px 0; }
}


/* 상세 페이지 (회사소개 - 공고) */
#view.announce .tit-box h4{ padding-top: 65px; }
#view.announce .tit-box .flex-box{ display: flex; justify-content: space-between; gap: 30px; margin-top: 55px; padding-bottom: 25px; }
#view.announce .tit-box .flex-box .file{ width: calc(100% - 200px); }
#view.announce .tit-box .flex-box .date{ margin-top: 5px; }

@media screen and (max-width: 1600px){
	#view.announce .tit-box h4{ padding-top: 50px; }
	#view.announce .tit-box .flex-box{ margin-top: 40px; }
}

@media screen and (max-width: 1280px){
	#view.announce .tit-box h4{ padding-top: 40px; } 
	#view.announce .tit-box .flex-box{ margin-top: 30px; }
}

@media screen and (max-width: 900px){
	#view.announce .tit-box h4{ padding-top: 25px; } 
	#view.announce .tit-box .flex-box{ margin-top: 20px; padding-bottom: 20px; gap: 20px; }
	#view.announce .tit-box .flex-box .date{ margin-top: 2px; }
	#view.announce .tit-box .flex-box .file{ width: calc(100% - 150px); }
}


/* 상세 페이지 (고객지원 - 이벤트) */
#view.event .tit-box{ padding: 50px; } 
#view.event .tit-box ul{ display: flex; margin-top: 25px; position: relative; padding: 7px 0; padding-left: 50px; }
#view.event .tit-box ul::before{ content: ""; width: 35px; height: 35px; background: url("/img/sub/event_icon.svg") no-repeat center center / contain; position: absolute; top: 50%; left: 0; transform: translateY(-50%); } 
#view.event .tit-box ul li{ font-family: var(--Poppins); font-size: 1.6rem; font-weight: 300; color: #777; position: relative; }
#view.event .tit-box ul li::after{ content: "~"; margin: 0 3px; }
#view.event .tit-box ul li:last-of-type::after{ display: none; }

@media screen and (max-width: 1280px){
	#view.event .tit-box{ padding: 30px; } 
	#view.event .tit-box ul{ margin-top: 15px; padding-left: 45px; }
	#view.event .tit-box ul::before{ width: 33px; height: 33px; }
}

@media screen and (max-width: 900px){
	#view.event .tit-box{ padding: 20px; }
	#view.event .tit-box ul{ padding-left: 40px; }
	#view.event .tit-box ul::before{ width: 30px; height: 30px; }
	#view.event .tit-box ul li{ font-size: 1.5rem; }
}


/* 상세 페이지 (고객지원 - 상세) */
#view.usage .tit-box{ padding: 60px 50px; }
#view.usage .tit-box span{ font-size: 1.7rem; font-weight: 500; color: var(--mainColor); }
#view.usage .tit-box .flex-box{ display: flex; justify-content: space-between; align-items: flex-end; margin-top: 15px; }
#view.usage .tit-box .flex-box h4{ width: calc(100% - 150px); font-weight: 500; }
#view.usage .tit-box .flex-box p{ display: inline-block; font-family: var(--Poppins); font-size: 1.6rem; font-weight: 300; color: #777; }

@media screen and (max-width: 1280px){
	#view.usage .tit-box{ padding: 40px 30px; }
	#view.usage .tit-box span{ font-size: 1.6rem; } 
	#view.usage .tit-box .flex-box{ margin-top: 10px; }
}

@media screen and (max-width: 900px){
	#view.usage .tit-box{ padding: 20px; }
	#view.usage .tit-box span{ font-size: 1.5rem; } 
	#view.usage .tit-box .flex-box{ flex-direction: column; align-items: flex-start; margin-top: 5px; }
	#view.usage .tit-box .flex-box h4{ width: 100%; }
	#view.usage .tit-box .flex-box p{ width: 100%; font-size: 1.5rem; text-align: right; margin-top: 10px; }
}


/* 개인정보처리방침 */
#privacy.sub-content{ padding-top: 0; }
#privacy .policy > *{ max-width: 100% !important; }
#privacy .policy .txt{ font-size: 1.9rem; font-weight: 400; color: #666; line-height: 1.6842; margin-bottom: 45px; }
#privacy .policy{ color: #333; }
#privacy dl dt{ font-size: 1.8rem; font-weight: 500; margin-bottom: 10px;}
#privacy dt span{ font-size: 2rem; }
#privacy dl dd{ font-size: 1.6rem; }
#privacy dl ul{ margin-top: 5px; }
#privacy dl ul:not(.not){ padding-left: 15px; }
#privacy dl.small-dl dt{ margin-top: 30px; }
#privacy dd{ color: #666; line-height: 1.6842; }
#privacy dl.small-dl dd:not(:last-of-type){ margin-bottom: 15px; }
#privacy dl.small-dl ul li{ margin-bottom: 5px; }
#privacy dl.small-dl ul li span{ display: inline-block; width: 100%; padding-left: 15px; }

#privacy table{ max-width: 100% !important; width: 100% !important; table-layout: auto; margin-top: 5px; margin-bottom: 15px; }
#privacy table th, #privacy table td{ padding: 10px; border: 1px solid #ddd; line-height: 1.3; }
#privacy table th{ font-size: 1.6rem; font-weight: 500; background: #eee; }
#privacy table:not(.col) tbody th{ background: none; }
#privacy table td{ font-size: 1.5rem; font-weight: 300; text-align: center; }
#privacy table td.bold{ font-size: 1.6rem; font-weight: 500; text-decoration: underline; }
#privacy table.col colgroup col:first-of-type{ width: 25%; }
#privacy table.col td:last-of-type{ text-align: left; }

#privacy ul.link li a{ font-weight: 500; color: var(--mainColor); text-decoration: underline; }
#privacy ul.link li::before{ content: "- "; }

#privacy table td.no-padding{ padding: 0; }
#privacy .select{ padding: 10px; position: relative; cursor: pointer; }
#privacy .select p{ position: relative; padding-right: 20px; }
#privacy .select p::after{ content: "\e936"; font-family: "xeicon"; font-weight: normal; font-style: normal; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#privacy .select.on p::after{ transform: translateY(-50%) rotate(180deg); }
#privacy .select ul{ width: calc(100% + 2px); position: absolute; top: 100%; left: -1px; background: #fff; border: 1px solid #ddd; padding: 5px 0; margin-top: 0; display: none; }
#privacy .select ul li{ margin-bottom: 0 !important; }
#privacy .select ul li a{ display: block; padding: 7px 10px; }

@media screen and (max-width: 1600px){
	#privacy .policy .txt{ font-size: 1.8rem; }
}

@media screen and (max-width: 1280px){
	#privacy .policy .txt{ font-size: 1.7rem; }
}

@media screen and (max-width: 900px){
	#privacy .policy .txt{ font-size: 1.6rem; }
}



/* 
	팝업창
*/
/* 공통 */
.popup-box{ position: fixed; width: 100%; height: 100%; z-index: 20; background: rgba(0, 0, 0, 0.25); top: 0; left: 0; z-index: 999; display: none; }
.popup-box *{ line-height: 1.3; }
.popup-box .blank{ width: 100%; height: 100%; } 
.popup-box .inner{ background: #fff; position: absolute; top: 50%; left: 50%; z-index: 30; transform: translate(-50%, -50%); }
.popup-box .close{ font-size: 3rem; color: #333; letter-spacing: -0.0025em; padding: 0; background: #fff; border: none; position: absolute; top: 50px; right: 50px; cursor: pointer; }

.popup-box .title{ width: calc(100% - 70px); }
.popup-box .title h5{ font-size: 3.6rem; font-weight: 600; color: #333; letter-spacing: -0.0025em; }

@media screen and (max-width: 1600px){
	/* 팝업 - 공통 */
	.popup-box .close{ top: 40px; }
	.popup-box .inner.register .title{ margin-bottom: 20px; }
	.popup-box .title h5{ font-size: 3rem; }
}

@media screen and (max-width: 1280px){
	/* 팝업 - 공통 */
	.popup-box .close{ top: 35px; }
	.popup-box .title h5{ font-size: 2.4rem; }
}

@media screen and (max-width: 900px){
	/* 팝업 - 공통 */
	.popup-box .close{ top: 28px; right: 30px; font-size: 2.8rem; }
	.popup-box .title h5{ font-size: 2.2rem; }
}



/* 접수 대기 중 팝업 */
#wait .inner{ max-width: 700px; width: 90%; height: 400px; max-height: 700px; padding: 70px; text-align: center; }
#wait .flex{ height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; }
#wait h5{ font-size: 3.6rem; font-weight: 600; color: #333; }
#wait h5.color{ color: var(--mainColor); margin-bottom: 5px; }
#wait .loader{ display: inline-block; position: relative; width: 50px; height: 50px; vertical-align: middle; border: 6px solid rgba(198, 0, 77, 0.1); border-radius: 50%; margin-top: 50px; }
#wait .loader:after{ content: ""; width: 100%; height: 100%; border-radius: 50px; border: 6px solid transparent; border-top-color: var(--mainColor); -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; position: absolute; top: -6px; right: -6px; bottom: -6px; left: -6px; }

@keyframes spin{
	0% {
		-webkit-transform: rotate(0deg);
		tranform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		tranform: rotate(360deg);
	}
}

@media screen and (max-width: 1600px){
	#wait h5{ font-size: 3rem; }
}

@media screen and (max-width: 1280px){
	#wait h5{ font-size: 2.8rem; }
	#wait .loader{ margin-top: 30px; }
}

@media screen and (max-width: 600px){
	#wait .inner{ height: 300px; }
}