@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
/* sub01_01 */
.story-wrap {max-width:1430px; padding:0 15px; position:relative; margin:0 auto; letter-spacing:-.03em;}
.story {background:url('../images/sub/story-bg.jpg') center center no-repeat; background-size:cover; padding:100px 0 150px;}
.story .head {position:relative; margin-bottom:60px;}
.story .head .tt {position:absolute; z-index:1; bottom:-75px; right:-75px;}
.story .head .tt img {animation:rotate_image 30s linear infinite; transform-origin:50% 50%;}
@keyframes rotate_image{100% {transform: rotate(360deg);}}
.story .cnt .tit {margin-bottom:130px;}
.story .cnt .tit h3 {position:relative; padding-left:40px; padding-top:30px; font-size:90px; line-height:1.1em; color:#222222; font-weight:500; font-family:'Montserrat';}
.story .cnt .tit h3 strong {font-weight:800;}
.story .cnt .tit h3:before {content:''; width:26px; height:26px; background:#ceef76; border-radius:50%; position:absolute; top:0; left:0;}
.story .cnt .col {display:flex; justify-content:space-between; margin:0 -10px;}
.story .cnt .row {max-width:602px; width:100%; margin:0 10px;}
.story .cnt .row.pt {padding-top:110px;}
.story .cnt .row .img-box {margin-bottom:36px;}
.story .cnt .row .txt-box {padding:0 30px;}
.story .cnt .row .txt-box p {font-size:20px; line-height:1.5em; color:#454545; margin-bottom:30px;}
.story .cnt .row .txt-box p:last-child {margin-bottom:0;}
/* sub01_02 */
.history .tit {text-align:center;}
.history .tit h3 {font-size:30px; color:#222222; line-height:1.3em; font-weight:500;}
.history .tit h3 strong {color:#91b96e;}
.history .col {display:flex; position:relative;}
.history .col:first-child {margin-top:136px;}
.history .col:nth-child(even) {flex-direction:row-reverse;}
.history .col:before {content:''; width:1px; height:100%; background:#91b96e; position:absolute; top:0; left:50%;}
.history .col:last-child:before {height:85%;}
.history .row {width:50%;}
.history .col:first-child .row .img-box  {margin-top:-80px;}
.history .col:nth-child(odd) .row .img-box {padding-right:100px;}
.history .col:nth-child(even) .row .img-box {padding-left:100px; text-align:right;}
.history .txt-box {margin-bottom:70px; min-height:122px; position:relative; width:100%; display:flex; align-items:center;}
.history .col:nth-child(odd) .txt-box {padding-left:100px;}
.history .col:nth-child(even) .txt-box {padding-right:100px;}
.history .txt-box .year {width:122px; line-height:122px; color:#fff; position:absolute; top:50%; margin-top:-61px; border-radius:50%; text-align:center; font-size:24px; font-weight:700; background:#91b96e; z-index:1;}
.history .col:nth-child(odd) .txt-box .year {left:-61px;}
.history .col:nth-child(even) .txt-box .year {right:-61px;}
.history .txt-box .txt {width:100%;}
.history .col .tt {display:flex; margin-bottom:10px;}
.history .col .tt:last-child {margin-bottom:0;} 
.history .col:nth-child(odd) .tt {text-align:left;}
.history .col:nth-child(even) .tt {text-align:right; flex-direction:row-reverse;}
.history .col .tt .month {width:50px; position:relative; font-size:18px; color:#333333; font-weight:700; line-height:1.5em;}
.history .col:nth-child(odd) .tt .month {padding-left:10px;}
.history .col:nth-child(even) .tt .month {padding-right:10px;}
.history .col .tt .month:before {content:''; width:5px; height:5px; background:#333; border-radius:50%; position:absolute; top:11px;}
.history .col:nth-child(odd) .tt .month:before {left:0;}
.history .col:nth-child(even) .tt .month:before {right:0;}
.history .col .tt ul {width:1%; flex:1 1 auto;}
.history .col .tt ul li {font-size:18px; color:#454545; line-height:1.5em;}
/* sub01_03 */
.believe {position:relative;}
.believe .tt {position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; opacity:0.1; z-index:-1;}
.believe .col {display:flex; margin:0 -75px;}
.believe .row {width:50%; padding:0 75px;}
.believe .cnt01 {margin-bottom:160px;}
.believe .cnt01 .txt-box {text-align:center; margin-bottom:56px;}
.believe .cnt01 .txt-box h3 {font-size:57px; font-weight:500; color:#333333; line-height:1.4em;}
.believe .cnt01 .txt-box h3 strong {color:#91b96e;}
.believe .cnt01 .img-box {max-width:511px;}
.believe .cnt02 .col {align-items:center; margin:0;}
.believe .cnt02 .txt-box {padding-left:60px; flex:1 1 auto; min-width:0; width:1%;}
.believe .cnt02 .txt-box p {font-size:18px; color:#333333; font-weight:500; line-height:1.5em; margin-bottom:20px;}
.believe .cnt02 .txt-box p:last-child {margin-bottom:0;}
.believe .cnt02 .img-box {width:50%; max-width:552px;}
/* sub02_01 */
.odor {margin-bottom:120px;}
.odor h3 {font-size:34px; line-height:1.2em; color:#91b96e; margin-bottom:20px;}
.odor p {font-size:16px; color:#454545; line-height:1.6em; margin-bottom:36px;}
.odor .img-box {margin-bottom:26px;}
.odor ul li {font-size:16px; color:#454545; line-height:1.6em; padding-left:10px; position:relative;}
.odor ul li:before {content:'*'; position:absolute; top:0; left:0;}
/* sub02 slider */
.product-slider .wrap {margin-bottom:40px;}
.product-slider .items {margin:0 -20px;}
.product-slider .item {padding:0 20px;}
.product-slider .btns {display:flex; justify-content:center; margin:0 -16px; position:relative;}
.product-slider .btns button {margin:0 16px; width:29px; height:18px; background-repeat:no-repeat; background-size:cover; background-color:transparent; transition:all 0.4s; font-size:0; border:0; position:relative;}
.product-slider .btns button.slick-prev {background-image:url('../images/sub/product-slider-prev.png');}
.product-slider .btns button.slick-next {background-image:url('../images/sub/product-slider-next.png');}
.product-slider .btns button.slick-prev:hover {background-image:url('../images/sub/product-slider-prev-on.png');}
.product-slider .btns button.slick-next:hover {background-image:url('../images/sub/product-slider-next-on.png');}
.product-slider .btns button:after {content:''; width:5px; height:5px; background:#999999; top:50%; margin-top:-2px; right:-19px; position:absolute; border-radius:50%;}
.product-slider .btns button:last-child:after {display:none;}
/* sub02_02 */
.sanitary-aid .head {margin-bottom:60px;}
.sanitary-aid .head .txt-box {margin:-100px auto 0; max-width:944px; text-align:center; background:rgba(255,255,255,0.9); position:relative; z-index:1; padding:46px 20px 60px;}
.sanitary-aid .head .txt-box h3 {font-size:40px; line-height:1.1em; color:#333333; margin-bottom:36px;}
.sanitary-aid .head .txt-box p {font-size:18px; line-height:1.5em; font-weight:500; color:#454545;}
.sanitary-aid .wrap {position:relative; padding:100px 0; background:#fdfdfd; max-width:1920px; margin:0 auto 144px;}
.sanitary-aid .wrap:before {content:''; width:50%; height:100%; background:url('../images/sub/sanitary-aid-bg.jpg') center center no-repeat; background-size:cover; position:absolute; left:0; top:0;}
.sanitary-aid .wrap .col {display:flex; align-items:center;}
.sanitary-aid .wrap .col > div {width:50%;}
.sanitary-aid .wrap .img-box {padding-right:20px;}
.sanitary-aid .wrap .txt-box {padding-left:70px;}
.sanitary-aid .wrap .txt-box h3 {font-size:40px; color:#333333; line-height:1.2em; margin-bottom:56px;}
.sanitary-aid .wrap .txt-box h3 span {color:#91b96e;}
.sanitary-aid .wrap .txt-box li {font-size:16px; line-height:1.5em; color:#454545; font-weight:500; margin-bottom:46px; padding-left:50px; position:relative; padding-top:4px;}
.sanitary-aid .wrap .txt-box li:before {content:''; width:30px; height:30px; background:url('../images/sub/sanitary-aid-check.png') 0 0 no-repeat; background-size:cover; position:absolute; left:0; top:0;}
.sanitary-aid .wrap .txt-box li:last-child {}
.sanitary-aid .cnt {margin-bottom:144px;}
.sanitary-aid .cnt h3 {font-size:40px; color:#333333; line-height:1.2em; text-align:center; margin-bottom:60px;}
.sanitary-aid .cnt .col {display:flex; margin-bottom:60px;}
.sanitary-aid .cnt .row {width:25%; text-align:center; position:relative;}
.sanitary-aid .cnt .row:after {content:''; width:29px; height:18px; background:url('../images/sub/sanitary-aid-arrow.png') 0 0 no-repeat; background-size:cover; position:absolute; top:120px; right:-9px;}
.sanitary-aid .cnt .row:last-child:after {display:none;}
.sanitary-aid .cnt .row span {font-size:16px; color:#999999; display:block; font-weight:700; line-height:1.5em; margin-bottom:10px;}
.sanitary-aid .cnt .row .icon {margin-bottom:16px;}
.sanitary-aid .cnt .row h4 {font-size:20px; color:#333333; line-height:1.4em; margin-bottom:12px;}
.sanitary-aid .cnt .row p {font-size:16px; color:#333333; line-height:1.6em;}

.sanitary-aid .cnt ul {display:flex; margin:0 -10px;}
.sanitary-aid .cnt ul li {width:25%; padding:0 10px;}

/* sub03_01 */
.campaign-wrap {max-width:1430px; padding:0 15px; position:relative; margin:0 auto; letter-spacing:-.03em;}
.campaign .head {background:url('../images/sub/campaign-head-bg.jpg') center center no-repeat; background-size:cover; padding:90px 0 300px;}
.campaign .cnt .tit {margin:-130px auto 0; text-align:center;}
.campaign .cnt .img-box {text-align:center; margin-bottom:116px;}
.campaign .cnt .txt-box {margin-bottom:80px; text-align:center;}
.campaign .cnt .txt-box span {display:block; font-size:26px; font-weight:500; color:#777; line-height:1.3em;}
.campaign .cnt .txt-box h3 {font-family:'GmarketSansBold'; font-size:40px; color:#638744; line-height:1.1em;}
.campaign .cnt .txt-box p {font-size:30px; color:#333333; font-weight:500; line-height:1.2em; position:relative; display:inline-block;}
.campaign .cnt .txt-box p:after {content:''; width:100%; height:20px; background:#ceef76; position:absolute; bottom:0; left:0; z-index:-1;}
.campaign .cnt01 {margin-bottom:100px;}
.campaign .cnt01 .txt-box span {margin-bottom:24px;}
.campaign .cnt01 .txt-box h3 {margin-bottom:30px;}
.campaign .cnt01 .box {border:5px solid #638744; border-radius:10px; padding:80px 70px; text-align:center;}
.campaign .cnt01 .tt {margin-bottom:56px;}
.campaign .cnt01 .tt h4 {display:inline-block; font-size:30px; line-height:70px; width:270px; border-radius:35px; color:#fff; font-family:'GmarketSansBold'; margin-bottom:30px;}
.campaign .cnt01 .tt1 h4 {background:#638744;}
.campaign .cnt01 .tt2 h4 {background:#9bbf7c;}
.campaign .cnt01 .tt p {font-size:26px; line-height:1.3em; color:#333333; font-weight:500;}
.campaign .cnt01 .tt1 p strong {color:#638744;}
.campaign .cnt01 .tt2 p strong {color:#9bbf7c;}
.campaign .cnt01 .txt {background:rgba(155,191,124,0.15); padding:86px 20px;}
.campaign .cnt01 .txt p {font-size:26px; color:#333333; line-height:1.2em; margin-bottom:20px; font-weight:500;}
.campaign .cnt01 .txt p:last-child {margin-bottom:0;}
.campaign .cnt02 .tit-box {background:url('../images/sub/campaign-cnt02-bg.jpg') center center no-repeat; background-size:cover; height:280px;}
.campaign .cnt02 .txt-box h3 {margin-bottom:12px;}
.campaign .cnt02 .txt-box p {margin-bottom:30px;}
.campaign .cnt02 .col {display:flex; margin:0 -20px;}
.campaign .cnt02 .row {width:33.3333333%; padding:0 20px;}
.campaign .cnt02 .inner {border-radius:30px; background:#f8fbf5;}
.campaign .cnt02 .inner .box {padding:40px 20px;}
.campaign .cnt02 .inner span {display:inline-block; line-height:55px; width:165px; color:#fff; font-family:'GmarketSansBold'; font-size:24px; font-weight:700; margin-bottom:46px; text-align:center; border-radius:28px;}
.campaign .cnt02 .inner1 span {background:#638744;}
.campaign .cnt02 .inner2 span {background:#b8d054;}
.campaign .cnt02 .inner3 span {background:#9bbf7c;}
.campaign .cnt02 .inner h4 {font-size:32px; line-height:1.2em; margin-bottom:40px; font-family:'GmarketSansBold';}
.campaign .cnt02 .inner1 h4 {color:#638744;}
.campaign .cnt02 .inner2 h4 {color:#b8d054;}
.campaign .cnt02 .inner3 h4 {color:#9bbf7c;}
.campaign .cnt02 .inner p {font-size:18px; font-weight:500; color:#333333; line-height:1.6em; margin-bottom:10px;}
.campaign .cnt02 .inner p:last-of-type {margin-bottom:0;}
/* sub03_02 */
.event {padding-top:25px;}
.event ul {display:flex; flex-wrap:wrap; margin:0 -10px;}
.event ul li {width:25%; padding:0 10px; margin-bottom:50px;}
.event ul li a {display:block;}
.event ul li a .img-box {margin-bottom:10px;}
.event ul li a .img-box .pic {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.event ul li a .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.event ul li a .tit {font-size:18px; color:#333333; line-height:1.5em; font-weight:500; margin-bottom:8px;}
.event ul li a .date {font-size:15px; color:#999999; line-height:1.8em;}
/* sub03_03 */
.social-tab {margin-bottom:80px;}
.social-tab ul {display:flex; margin:0 -10px; justify-content:center;}
.social-tab ul li {padding:0 10px;}
.social-tab ul li a {display:block; line-height:53px; width:230px; text-align:center; border:1px solid #ddd; border-radius:28px; color:#000; font-size:18px; font-weight:500; letter-spacing:0;}
.social-tab ul li.active a {color:#fff; background:#91b96e; border-color:#91b96e;}
/* sub03_03_01 */
.insta ul {display:flex; flex-wrap:wrap; margin:0 -10px;}
.insta ul li {width:25%; padding:0 10px; margin-bottom:50px;}
.insta ul li a {display:block;}
.insta ul li a .img-box {margin-bottom:10px;}
.insta ul li a .img-box .pic {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.insta ul li a .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
/* sub03_03_02 */
.youtube-list ul {display:flex; flex-wrap:wrap; margin:0 -18px;}
.youtube-list ul li {width:33.3333333%; padding:0 18px; margin-bottom:36px;}
.youtube-list ul li a {display:block;}
.youtube-list ul li a .img-box {margin-bottom:16px;}
.youtube-list ul li a .img-box .pic {position:relative; height:0; padding-bottom:56.38%; overflow:hidden;}
.youtube-list ul li a .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.youtube-list ul li a .tit {font-size:18px; letter-spacing:0; font-weight:500; color:#333; text-align:center;}
/* sub04_01 */
.inquiry {margin-bottom:120px;}
.inquiry .tit {margin-bottom:86px; text-align:center;}
.inquiry .tit h3 {font-size:30px; color:#222222; line-height:1.1em; font-weight:500;}
.inquiry .col {display:flex; margin:0 -20px;justify-content:space-between;}
.inquiry .row {padding:0 20px;}
.inquiry .row1 {width:auto;}
.inquiry .row2 {max-width:680px; width:100%;}
.inquiry .row .tt {margin-bottom:30px; letter-spacing:0;}
.inquiry .row .tt h4 {font-size:20px; color:#242424; line-height:1.4em; margin-bottom:14px;}
.inquiry .row .tt p {font-size:16px; color:#555555; line-height:1.6em;}
.inquiry .row .txt {display:flex; margin:0 -15px;}
.inquiry .row .txt .tt {width:50%; padding:0 15px;}
.inquiry .row .box {display:flex; align-items:center; justify-content:space-between;}
.inquiry .row .box .check {font-size:16px; color:#505050; line-height:1.6em;}
.inquiry .row .box .check a {border:1px solid #ddd; text-align:center; width:70px; line-height:26px; background:#fff; font-size:13px; color:#505050; display:inline-block; margin-left:10px;}
.inquiry .row .box .btn {width:130px; line-height:50px; text-align:center; color:#fff; background:#91b96e; font-size:18px; font-weight:500; border:0;}
.maps {width:100%; height:500px;}
.maps iframe {width:100%; height:100%;}
/* sub04_02 */
.partners h3 {font-size:50px; line-height:1.2em; color:#333333; margin-bottom:26px; text-align:right;}
.partners .img-box {margin-bottom:60px;}
.partners .col {display:flex; align-items:center;}
.partners .col .tit {width:140px;}
.partners .col .tit p {font-size:34px; color:#333; font-weight:600; line-height:1.4em; text-align:justify; text-align-last:justify;}
.partners .col .txt {width:1%; flex:1 1 auto; padding-left:100px; position:relative;}
.partners .col .txt:before {content:''; width:18px; height:6px; background:#91b96e; position:absolute; left:30px; bottom:0;}
.partners .col .txt .box {background:#91b96e; display:flex; padding:26px 50px; color:#fff; align-items:center; justify-content:space-between;}
.partners .col .txt .box .tel {font-size:50px; font-weight:700; line-height:1.1em;}
.partners .col .txt .box .tel:before {content:''; width:48px; height:48px; background:url('../images/sub/partners-tel.png'); display:inline-block; vertical-align:middle; margin-top:-9px; margin-right:20px;}
.partners .col .txt .box .tel span {display:inline-block; font-size:20px; line-height:1.4em;}
.partners .col .txt .box p {font-size:18px; font-weight:600; line-height:1.5em; text-align:right;}
/* sub04_03 */
.recruitment .head {display:flex; margin-bottom:140px;}
.recruitment .head .img-box {max-width:433px; width:100%;}
.recruitment .head .txt-box {width:1%; flex:1 1 auto; padding-left:90px; padding-top:60px;}
.recruitment .head .txt-box .icon {margin-bottom:70px;}
.recruitment .head .txt-box h3 {font-size:32px; color:#333333; line-height:1.3em; margin-bottom:36px; padding-bottom:40px; position:relative; font-family:'GmarketSansBold';}
.recruitment .head .txt-box h3:after {content:''; width:10px; height:2px; background:#555; position:absolute; left:0; bottom:0;}
.recruitment .head .txt-box h3 strong {color:#91b96e;}
.recruitment .head .txt-box p {font-size:20px; line-height:1.5em; font-weight:500; color:#333333;}
.recruitment .cnt {margin-bottom:40px;}
.recruitment-list ul {display:flex; flex-wrap:wrap; margin:0 -15px;}
.recruitment-list ul li {width:25%; padding:0 15px; margin-bottom:30px;}
.recruitment-list ul li a {display:block; background:#fff; border-radius:15px; box-shadow:5px 5px 15px 4px rgba(0,0,0,0.14); padding:30px 20px; transition:all 0.4s;}
.recruitment-list ul li a .clas {text-align:center; margin-bottom:30px;}
.recruitment-list ul li a .clas span {display:inline-block; width:80px; line-height:35px; color:#fff; background:#91b96e; border-radius:18px;}
.recruitment-list ul li a .tit {margin-bottom:30px; padding-bottom:30px; border-bottom:1px solid #ddd;}
.recruitment-list ul li a .tit h3 {font-size:18px; color:#333333; line-height:1.5em; font-weight:500; height:calc(1.5em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.recruitment-list ul li a .date {font-size:15px; line-height:1.7em; color:#999999; margin-bottom:16px;}
.recruitment-list ul li a .d-day {font-size:15px; font-weight:600; line-height:1.7em; text-align:right;}
.recruitment-list ul li a .d-day.ing {color:#91b96e;}
.recruitment-list ul li a .d-day.end {color:#555555;}
.recruitment-list ul li a:hover {background:#91b96e; transition:all 0.4s;}
.recruitment-list ul li a:hover .clas span {color:#333333; background:#fff; transition:all 0.4s;}
.recruitment-list ul li a:hover .tit h3 {color:#fff; transition:all 0.4s;}
.recruitment-list ul li a:hover .date {color:#fff; transition:all 0.4s;}
.recruitment-list ul li a:hover .d-day.ing {color:#fff; transition:all 0.4s;}
.recruitment-list ul li a:hover .d-day.end {color:#fff; transition:all 0.4s;}
/* sub04_03detail */
.recruitment-detail .tit {margin-bottom:30px;}
.recruitment-detail .tit dl {display:flex; border-bottom:1px solid #ddd; font-size:15px; letter-spacing:0; line-height:1.5em; padding:12px 0;}
.recruitment-detail .tit dl:first-child {border-top:2px solid #868686;}
.recruitment-detail .tit dt {width:140px; padding:0 10px; color:#333333; font-weight:500;}
.recruitment-detail .tit dd {color:#454545;}
.recruitment-detail .cnt {margin-bottom:60px;}
.recruitment-detail .list {text-align:center;}
.recruitment-detail .list a {display:inline-block; width:144px; line-height:50px; color:#fff; background:#91b96e; font-size:16px; letter-spacing:0; font-weight:600;}