@charset "utf-8";
/********************
** 해더
********************/
header{top:0;}
header > a{border-radius:0 0 24px 24px;}

/********************
** 메인배너
********************/
.mainImg_01{top:10%; left:-2%; animation: floatUp 3s ease-in-out infinite;}
.mainImg_02{top:9%; right:-13%;}
.mainImg_03{bottom:30%; left:-15%;}
.mainImg_04{bottom:15%; left:15%; animation: floatDown 3s ease-in-out infinite;}
.mainImg_05{bottom:25%; right:0%; animation: floatUp 3s ease-in-out infinite;}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); } 
}

@keyframes floatDown {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(20px); } 
}

/********************
** problem
********************/
.problem{background:url('/img/receipt/problemBg.jpg'); background-size:100%; background-repeat: no-repeat; background-position:bottom;}

/********************
** solution
********************/
.solution{background: linear-gradient(to bottom, #fff, #EEFFF4);}

.whyImg{bottom:0; right:30px;}

.eventBox{overflow: hidden; max-width: 1200px;}
.eventBox_mid{background-image: linear-gradient(to bottom, #fff 50%, #2563EB 50%);}

.eventBox_mid::before,
.eventBox_mid::after {    content: '';    position: absolute;    top: 0;     width: 45px;     height: 45px;     background-color: #161823;    border-radius: 50%;     transform: translateY(-50%); }
.eventBox_mid::before {    left: 0;    transform: translate(-50%, 0%); }
.eventBox_mid::after {    right: 0;    transform: translate(50%, 0%); }

/********************
** Contact
********************/

.inputBox{ padding: 24px; border: 1px solid #D9DADE; border-radius: 4px;}
.inputBox:placeholder-shown{color: #91949f; line-height: 1em;}

.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:#2563EB; border:1px solid #2563EB; color:#fefefe}


.custom-checkbox{width: 20px; height: 20px; padding: 0; border: 1px solid #26272b; border-radius: 4px; 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: #2563EB; border-color: #2563EB;}
.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);}

.moreBtn{text-decoration: underline;}

.onlineBtn{ cursor: pointer;}