@charset "utf-8";

/********************
** 메인배너
********************/
.mainBanner {    position: relative;    overflow: hidden;}
.bg_image {    top: 0;    left: 0;    background-size: cover;    background-position: center;    transition: opacity 1.5s ease-in-out; /* 배경 전환 애니메이션 */}
.bg1 {    background-image: url('/img/lawnyou/mainBanner1.jpg');    opacity: 1; /* --- 수정된 부분: 초기 상태 명시 --- */}
.bg2 {    background-image: url('/img/lawnyou/mainBanner2.jpg');    opacity: 0; /* --- 수정된 부분: 초기 상태 명시 --- */}
.center_content {    position: absolute;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    width: 100%;    text-align: center;}
.txtWrap {    height: 250px;    overflow: hidden; }
.turn_container {    transition: transform 1s ease-in-out;}
.turnTxt {    height: 250px;}

.btnImg{transform:rotate(225deg); transition: 0.3s;}

.mainBtn {    position: relative;    transition: color 0.3s;  }
.mainBtn::after {content: "";position: absolute;left: 0;bottom: 0;width: 0%;height: 1px;background: #fff;transition: width 0.3s ease;}
.mainBtn:hover::after {width: 100%;}
.mainBtn:hover .btnImg{transform:rotate(0deg);}


/********************
** 진실
********************/
.trust{background:url('/img/lawnyou/trustCaseBg.jpg'); background-size:cover; background-position:center}
.trustImg{background:url('/img/lawnyou/trustImg.jpg'); background-size:cover;}
.trustTit{text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 16px; }
.trustImg1{top:-23%; left:-4%}
.trustImg2{bottom:-23%; right:-5%}
.newsBox{background:rgba(255, 255, 255, 0.1);}
.newsContant{opacity:0.3;}
.newsBox1{left:40px; }
.newsBox2{ left:0}
.newsBox3{right:0;}
.newsBox4{ left:10px }


/********************
** case
********************/
.caseBox{background: linear-gradient(to bottom right, #F7F8F8, #EEEEF0);}
.caseImg{    top: -25%; right:-100px;  }
.caseTxtBox {    position: relative;    height: auto;  width: 800px;  }
.dotWord {    display: inline-block;    position: relative;  }
.dotWord::before,
.dotWord::after {    content: "";    position: absolute;    top: -10px;    width: 8px;    height: 8px;    border-radius: 50%;    background: #ff4f79;  }
.dotWord::before { left: 25%; }
.dotWord::after { right: 25%; }



/********************
** processs
********************/
.processsList{display:grid; grid-template-columns: repeat(3, 1fr);}
.processsImg{top:-1px; right:-1px; object-fit: cover;}
.processsList div{border-bottom:5px solid #F23054;}
.slide1,
.slide2 {  position: absolute;  left: 0;  width: 100%;  padding:24px 0;  z-index: 1;}
.slide1 {  top: 0;}
.slide2 {  bottom: 0;}
.slide1 img,
.slide2 img {  width: 100%;  height: 100%;  object-fit: cover;}
.swiper-wrapper {  display: flex;  align-items: center;}
.swiper-slide {  flex-shrink: 0;  width: auto;}
.swiper-wrapper {    transition-timing-function: linear !important;  }

/********************
** qa
********************/
.online{background:url('/img/lawnyou/formBg.jpg'); background-size:cover;}
.qaImg{top:0; left:50%; transform: translate(-50%, -50%); }
.online input[type="radio"]{left:-9999px}
.online input[type="radio"] + label{border:1px solid #D9DADE; background:#fefefe; cursor: pointer; transition: ease-in 0.3s;}
.online input[type="radio"]:checked + label{background:#E01E4C; border:1px solid #E01E4C; color:#fefefe}
.btnBox{display:grid; grid-template-columns:repeat(5, 1fr)}
.inputBox{ padding: 24px; border: 1px solid #D9DADE ;}
.inputBox:placeholder-shown{color: #91949f; line-height: 1em;}
.moreBtn{text-decoration: underline;}
.custom-checkbox{width: 20px; height: 20px; padding: 0; border: 1px solid #222; background-color: #fff; margin-right: 10px; transition: background-color 0.3s, border 0.3s; position: relative;}
.checkpolicy input[type="checkbox"] {display: none;}
.checkpolicy input[type="checkbox"]:checked + .custom-checkbox{background-color: #E01E4C; border-color: #E01E4C;}
.checkpolicy input[type="checkbox"]:checked + .custom-checkbox::after{content: ''; position: absolute; top: 2px; left: 5px; width: 5px; height: 8px; border: solid white; border-width: 0 3px 3px 0; transform: rotate(45deg);}