@charset "UTF-8";

@import url('https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard.css');
.buy_wrap{background: #fcfcfc; width: 100%; height: 1080px; display: flex; justify-content: center;}
.buy_wrap *{font-family: 'Pretendard'; box-sizing: border-box; list-style: none;}
.buy_wrap .mOnly{display: none;}
.buy_wrap .pcOnly{display: block;}
.buy_wrap .mask{position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,0.4); display: none; z-index: 100;}
.goDownBtn{width: 80px; height: 80px; position: fixed; left: 50%; bottom: 56px; transform: translateX(-50%); background: url('/resources/homepage/img/buy_goDown.png') no-repeat; cursor: pointer; user-select: none; z-index: 10;}
.inner{width: 1280px; min-width: 1280px; padding-top: 120px;}
.taxLogo{width: 220px; height: 67px; background: url('/resources/homepage/img/buy_proLogo.png') center no-repeat; margin: 0 auto;}
.buy_wrap h3{font-family: 'Gmarket Sans' !important; font-weight: bold; font-size: 60px; letter-spacing: -3.6px; color: #001248; width: 100%; text-align: center; margin: 0 0 62px;}
.buy_wrap h4{font-family: 'Gmarket Sans' !important; font-weight: 500; font-size: 40px; letter-spacing: -2px; color: #001248; width: 100%; text-align: center;}
.buy_wrap h4 strong{font-family: 'Gmarket Sans' !important; font-weight: bold;}
.buy_cont1{position: relative; width: 100%; margin-top: 16px; display: flex;}
.buy_cont1 .left{width: fit-content;}
.blueBox{width: 100%; height: 50px; background: #e0eaff; border-radius: 13px; display: flex; gap: 0 56px; justify-content: center; align-items: center; position: absolute; left: 0; top: 0;}
.blueBox li{padding-left: 30px; height: 24px; display: flex; align-items: center; background: url('/resources/homepage/img/buy_pointCheck.png') no-repeat; font-weight: 300; font-size: 16px; letter-spacing: -0.96px; color: #000041;}
.buy_cont1 .right{width: calc(100% - 698px); padding: 97px 0 0 18px;}
.buy_cont1 .right ul{display: flex; flex-flow: column; gap: 20px 0;}
.buy_cont1 .right ul li{width: 100%; height: 180px; border: 1px solid #e2e2e2; border-radius: 20px; box-shadow: 2px 3px 26px 0 rgba(0, 0, 0, 0.06); padding: 38px 0 0 204px;
	font-weight: bold; font-size: 25px; letter-spacing: -1.25px; color: #000;
}
.buy_cont1 .right ul li:nth-child(1){background: #fff url('/resources/homepage/img/buy_speacker.png') 28px center no-repeat;}
.buy_cont1 .right ul li:nth-child(2){background: #fff url('/resources/homepage/img/buy_note.png') 28px center no-repeat;}
.buy_cont1 .right ul li .goBtn{width: 200px; height: 54px; background: #001248; border-radius: 13px; margin-top: 20px; font-weight: bold; font-size: 23px; letter-spacing: -1.15px; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; user-select: none;}
.buy_cont1 .right .counsNum{width: 100%; margin-top: 30px; font-size: 32px; letter-spacing: -1.28px; color: #0430b2; font-weight: bold; font-family: 'Gmarket Sans' !important; text-align: center;}

.buy_cont2{margin: 82px 0 140px; }
.buy_wrap .cont_title{font-family: 'Gmarket Sans' !important; margin-bottom: 50px; font-size: 40px; letter-spacing: -2.4px; color: #001248;  text-align: left;}
.grayForm{width: 100%; padding: 50px; background: #fafafa; display: flex; flex-flow: column; border-radius: 20px;}
.buy_cont3 .grayForm{padding: 30px 50px 50px 50px;}
.buy_cont2 .grayForm{gap: 20px 0;}
.buy_cont2 .grayForm li{display: flex;}
.buy_cont2 .grayForm li.require label::after{position: absolute; left: -16px; top: 50%; transform: translateY(-50%); content: '*'; font-size: 25px; letter-spacing: -1.25px; color: #de0d0d;}
.buy_cont2 .grayForm label{width: 178px; height: 54px; font-weight: bold; font-size: 25px; letter-spacing: -1.25px; color: #000; display: flex; align-items: center; position: relative;}
.buy_cont2 .grayForm .right{width: calc(100% - 178px);}
.buy_cont2 .grayForm .right.location{display: flex; flex-flow: column; gap: 20px 0;}
.buy_cont2 .grayForm .row{height: 54px; display: flex; gap: 0 8px;}
.buy_cont2 .grayForm .row input{width: 100%; height: 100%; border-radius: 12px; background: #fff; border: 1px solid #e2e2e2; padding: 0 20px; font-weight: 400; font-size: 20px; letter-spacing: -0.4px; color: #999; outline: none; color: #000;}
.buy_cont2 .grayForm .row input:focus{border-color: #0430b2;}
.buy_cont2 .grayForm .row input::placeholder{color: #999;}
.buy_cont2 .grayForm .require.on input{border-color: #de0d0d;}
.buy_cont2 .grayForm .require.on input::placeholder{color: #de0d0d;}
.buy_cont2 .grayForm li:nth-child(6) .row:nth-child(1) input{width: 300px;}
.buy_cont2 .grayForm .formBtn{width: 146px; height: 100%; background: #0430b2; border-radius: 12px; cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: center;
	font-weight: 500; font-size: 20px; letter-spacing: -0.4px; color: #fff;
}
.cont3_blueTxt{font-weight: 600; font-size: 20px; letter-spacing: -1px; color: #0430b2; text-align: right;}
.cont3_chkList{display: flex; flex-flow: column; gap: 20px 0; margin: 8px 0 20px;}
.cont3_chk1{position: relative;}
.cont3_chk1 input[type="checkbox"]{display: none;}
.cont3_chk1 input[type="checkbox"] + label{width: 100%; height: 54px; border: 2px solid #e2e2e2; border-radius: 12px; background: #fafbff url('/resources/homepage/img/buy_chkBox.png') 24px center no-repeat; display: flex; padding: 0 40px 0 24px; align-items: center; justify-content: space-between;}
.cont3_chk1 input[type="checkbox"]:checked + label{border: 2px solid #0430b2; background: #fafbff url('/resources/homepage/img/buy_chkBox_on.png') 24px center no-repeat;}
.cont3_chk1 input[type="checkbox"] + label span.chkTxt { height:100%; padding-left:34px;user-select:none; cursor:pointer;
  font-weight: bold; font-size: 25px; letter-spacing: -1.25px; color: #000; text-align: left; white-space: nowrap; display: flex; align-items: center; 
}	
.cont3_chk1 input[type="checkbox"] + label span.chkTxt strong{font-weight: 600; color: #6d85cb; margin: 0 0 0 66px;}
.cont3_chk1 input[type="checkbox"] + label span.chkTxt strong>span{font-weight: 600; color: #0430b2; margin-left: 12px;}
.cont3_chk1 .poa{position: absolute; right: 41px; top: 50%; transform: translateY(-50%);}
.cont3_chk1 .valueCont{position: relative; font-weight: 600; font-size: 20px; letter-spacing: -1px; color: #000; display: flex; align-items: flex-end;}
.cont3_chk1 .valueCont::before{content: '월'; position: absolute; left: -28px; bottom: 0; font-weight: 600; font-size: 20px; letter-spacing: -1px; color: #767676;}
.cont3_chk1 .valueCont span{margin-right: 2px; font-weight: 600; font-size: 30px; letter-spacing: -1.5px; color: #000;}
.form_subTitBox{display: flex; justify-content: space-between; margin: 40px 0 20px;}
.form_subTitBox .form_subTitle{font-family: 'Pretendard' !important; width: auto; font-weight: bold; font-size: 25px; letter-spacing: -1.25px; color: #000;}
.buy_cont3 span.cont3_graytip{font-weight: 500; font-size: 20px; letter-spacing: -1px; color: #606060; white-space: nowrap;}
.cont3_chkList{width: 100%; display: flex; gap: 20px; flex-wrap: wrap;}
.cont3_chkList input{display: none;}
.cont3_chkList li{width: calc((100% - 40px) / 3); height: 166px; background: #fff; border-radius: 12px;}
.cont3_chkList li input[type="checkbox"] + label{width: 100%; height: 100%; background: url('/resources/homepage/img/buy_chkBox.png') center 20px no-repeat;
 padding: 58px 20px 0; border: 1px solid transparent; box-shadow: 0 0 0 1px #e2e2e2 inset; border-radius: 12px; display: flex; cursor: pointer; flex-flow: column;}
.cont3_chkList li input[type="checkbox"]:checked + label{background: url('/resources/homepage/img/buy_chkBox_on.png') center 20px no-repeat;
border: 1px solid #0430b2; box-shadow: 0 0 0 1px #0430b2 inset;}
.cont3_chkList li input[type="checkbox"] + label .useOptionTxt{width: 100%; height: 44px; font-weight: 600; font-size: 25px; letter-spacing: -1.25px; color: #6d85cb;
background: #eaefff; border-radius: 12px; display: flex; align-items: center; justify-content: center; gap: 0 12px;}
.cont3_chkList li input[type="checkbox"] + label .useOptionTxt strong{color: #0430b2;}
.cont3_chkList li input[type="checkbox"] + label .valueCont{width: fit-content; margin: 8px auto 0; font-weight: 600; font-size: 20px; letter-spacing: -1px; color: #000; display: flex; justify-content: center; align-items: flex-end; position: relative;}
.cont3_chkList li input[type="checkbox"] + label .valueCont::before{content: '월'; position: absolute; left: -28px; bottom: 0; font-weight: 600; font-size: 20px; letter-spacing: -1px; color: #767676;}
.cont3_chkList li input[type="checkbox"] + label .valueCont span{margin-right: 2px; font-weight: 600; font-size: 30px; letter-spacing: -1.5px; color: #000;}
.buy_cont4{margin-top: 20px;}
.buy_cont4 .grayForm{padding: 42px 50px;}
.buy_cont4 .termChk{display: flex; flex-flow: column; gap: 20px;}
.buy_cont4 .termChk li{display: flex; justify-content: space-between; align-items: center;}
.buy_cont4 .termChk li input[type="checkbox"]{display: none;}
.buy_cont4 .termChk li input[type="checkbox"] + label{padding-left: 44px; background: url('/resources/homepage/img/buy_chkBox.png') left center no-repeat;
font-weight: 500; font-size: 25px; letter-spacing: -1.25px; color: #767676; cursor: pointer; user-select: none;}
.buy_cont4 .termChk li input[type="checkbox"]:checked + label{background: url('/resources/homepage/img/buy_chkBox_on.png') left center no-repeat;}
.buy_cont4 .termChk li .btn_detail{font-weight: 500; font-size: 20px; letter-spacing: -1px; color: #969696; text-decoration: underline; display: flex; align-items: center; justify-content: center; cursor: pointer; user-select: none;}
.buy_wrap .btnCont{width: 100%; display: flex; justify-content: center;}
.buy_cont4 .termChk .require.on input[type="checkbox"] + label{background: url('/resources/homepage/img/buy_chkBox_red.png') left center no-repeat;}
.buy_cont4 .termChk .require.on input[type="checkbox"]:checked  + label{background: url('/resources/homepage/img/buy_chkBox_on.png') left center no-repeat;}
.buy_wrap .btnCont .goAppBtn{margin: 100px 0 150px; width: 442px; height: 90px; background: #001248; font-family: 'Gmarket Sans' !important; font-size: 29px; letter-spacing: -1.45px; color: #fff; cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: center; border-radius: 18px;}
.buy_wrap .btnCont .goAppBtn strong{color: #00e78f; font-weight: bold;}

.termBox{width: 820px; height: 597px; background: #fff; border-radius: 20px; box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.16); position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 101; overflow: hidden; box-sizing: border-box; display: none;}
.termBox *{box-sizing: border-box; font-family: 'Pretendard' !important;}
.termBox .titleCont{width: 100%; height: 64px; padding: 0 26px 0 34px; background: #001248; display: flex; align-items: center; justify-content: space-between;}
.termBox .titleCont h5{font-weight: bold; font-size: 20px; letter-spacing: -1px; color: #fff;}
.btn_popClose{width: 24px; height: 24px; background: url('/resources/homepage/img/buy_popClose.png') no-repeat; background-size: 24px 24px; cursor: pointer; user-select: none;}
.termBox .txtCont{width: 100%; height: 452px; padding: 30px 16px 30px 34px;}
.termBox .txtCont .txtBox{height: 100%; overflow: hidden; overflow-y: auto; padding-right: 20px; font-weight: 400; font-size: 15px; letter-spacing: -0.75px; color: #767676; line-height: 24px;}
.termBox .txtCont .txtBox::-webkit-scrollbar{width: 8px;}
.termBox .txtCont .txtBox::-webkit-scrollbar-thumb{background: #e6e6e6; border: 6px solid transparent; border-radius: 35px;}
.termBox .txtCont .txtBox::-webkit-scrollbar-track{background: transparent;}
.termBox .txtCont .txtBox p{word-break: keep-all; display: none;}
.termBox .okayBox{width: 100%; height: 80px; border-top: 1px solid #e0e0e0;}
.termBox .okayBox .btn_okay{width: 100%; height: 100%; font-weight: bold; font-size: 23px; letter-spacing: -1.15px; color: #000; display: flex; align-items: center; justify-content: center; user-select: none; cursor: pointer;}
@media (max-width:768px){
	.buy_wrap .pcOnly{display: none;}
	.buy_wrap .mOnly{display: block;}
	.buy_wrap{height: 1218px;}
	.goDownBtn{display: none !important;}
	.inner{width: 100%; padding-top: 62px; padding: 62px 20px 0; min-width: unset;}
	.taxLogo{width: 198px; height: 62px; background: url('/resources/homepage/img/m_buy_proLogo.png') center no-repeat; background-size: 198px 62px; margin: 0 auto;}
	.buy_wrap h3{font-size: 40px; margin: 0 0 47px;}
	.buy_wrap h4{font-size: 26px; line-height: 34px; letter-spacing: -0.78px;}
	.buy_wrap .cont_title{text-align: left; font-size: 24px; letter-spacing: -1.2px; margin-bottom: 20px;}	
	.buy_cont1{flex-flow:column; margin-top: 0;}
	.buy_cont1 .left img{width: 100%;}
	.buy_cont1 .right{width: 100%; padding: 16px 0 0 0;}
	.buy_cont1 .right ul{gap: 12px 0;}
	.buy_cont1 .right ul li{height: 106px; padding: 22px 0 0 96px; font-size: 17px; letter-spacing: -0.51px; border-radius: 12px; box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.05);}
	.buy_cont1 .right ul li .goBtn{width: 104px; height: 32px; margin-top: 10px; font-size: 15px; letter-spacing: -0.75px; border-radius: 10px;}
	.buy_cont1 .right ul li:nth-child(1){background: #fff url('/resources/homepage/img/m_buy_speacker.png') 20px center no-repeat; background-size: 62px 62px;}
	.buy_cont1 .right ul li:nth-child(2){background: #fff url('/resources/homepage/img/m_buy_note.png') 20px center no-repeat; background-size: 62px 62px;}
	.buy_cont1 .right .counsNum{margin-top: 24px; font-size: 20px; letter-spacing: -1.2px;}
	.blueBox{flex-flow: column; height: auto; padding: 24px 0 24px 28px; margin-top: -24px; justify-content: start; gap: 16px 0; position: initial; border-radius: 12px;}
	.blueBox li{justify-content: start; align-items: start; height: auto; min-height: 16px; padding-left: 22px;
	width: 100%; font-size: 15px; letter-spacing: -0.9px; background: url('/resources/homepage/img/m_buy_pointCheck.png') no-repeat; background-size: 16px 16px;}
	.blueBox li:nth-child(2){line-height: 23px; background: url('/resources/homepage/img/m_buy_pointCheck.png') 0 3px no-repeat; background-size: 16px 16px;}
	.grayForm{padding: 16px 16px 16px 23px; border-radius: 12px;}
	.buy_cont2{margin: 52px 0 60px;}
	.buy_cont2 .grayForm{gap: 12px 0;}
	.buy_cont3 .grayForm{padding: 12px 16px 16px;}
	.buy_cont2 .grayForm label{font-size: 15px; letter-spacing: -0.45px; height: 36px; width: 107px;}
	.buy_cont2 .grayForm li.require label::after{font-size: 15px; letter-spacing: -0.45px; left: -7px;}
	.buy_cont2 .grayForm .right{width: calc(100% - 107px);}
	.buy_cont2 .grayForm .row{height: 36px; gap: 0 4px;}
	.buy_cont2 .grayForm .row input{border-radius: 8px; font-size: 15px; letter-spacing: -0.45px; padding: 0 12px;}
	.buy_cont2 .grayForm li:nth-child(1) .row input,.buy_cont2 .grayForm li:nth-child(6) .row:nth-child(1) input{width: 100%;}
	.buy_cont2 .grayForm .right.location{gap: 8px 0;}
	.buy_cont2 .grayForm .formBtn{width: 93px; font-size: 15px; font-weight: 400; letter-spacing: -0.45px; border-radius: 8px;}
	
	
	
	.cont3_blueTxt{font-size: 13px; letter-spacing: -0.39px;}
	.cont3_chk1 input[type="checkbox"] + label{width: 100%; height: 100%; background: #fafbff url('/resources/homepage/img/m_buy_chkBox.png') 12px center no-repeat; background-size: 16px 16px; height: 66px; position: relative; padding: 0 12px; border-radius: 8px;}
	.cont3_chk1 input[type="checkbox"]:checked + label{background: #fafbff url('/resources/homepage/img/m_buy_chkBox_on.png') 12px center no-repeat; background-size: 16px 16px;}
	.cont3_chk1 input[type="checkbox"] + label span.chkTxt { height:100%; padding-left:26px; font-size: 15px; letter-spacing: -0.45px; line-height: 24px;
	width: 112px; display: flex; white-space: break-spaces; align-items: center;}
	.cont3_chk1 input[type="checkbox"] + label span.chkTxt strong>span{margin-left: 4px;}
	.cont3_chk1 input[type="checkbox"] + label span.chkTxt strong{position: absolute; right: 12px; top: 12px;}
	.cont3_chk1 .poa{right: 12px;}
	.cont3_chk1 .valueCont{font-size: 13px; letter-spacing: -0.39px; margin: 22px 0 0 auto; line-height: 1.1px;}
	.cont3_chk1 .valueCont::before{left: -18px; font-size: 13px; letter-spacing: -0.39px;}
	.cont3_chk1 .valueCont span{font-size: 17px; letter-spacing: -0.51px; margin-right: 1px;}
	.form_subTitBox{flex-flow: column; gap: 10px 0; justify-content: start; margin: 26px 0 12px;}
	.form_subTitBox .form_subTitle{text-align: left; font-size: 15px; letter-spacing: -0.45px; line-height: 1;}
	.buy_cont3 span.cont3_graytip{font-size: 15px; line-height: 24px; letter-spacing: -0.45px;}
	.cont3_chkList{gap: 12px 0; margin-bottom: 12px;}
	.cont3_chkList li{width: 100%; height: 44px; border-radius: 8px;}
	.cont3_chkList li input[type="checkbox"] + label{padding: 0 12px 0 38px; background: url('/resources/homepage/img/m_buy_chkBox.png') 12px center no-repeat; background-size: 16px 16px; flex-flow: row; align-items: center; border-radius: 8px;}
	.cont3_chkList li input[type="checkbox"]:checked + label{background: url('/resources/homepage/img/m_buy_chkBox_on.png') 12px center no-repeat; background-size: 16px 16px;}
	.cont3_chkList li input[type="checkbox"] + label .useOptionTxt{width: calc(100% - 123px); height: 32px; border-radius: 8px; justify-content: start; padding-left: 10px;
	font-size: 15px; letter-spacing: -0.45px; gap: 0 4px;}
	.cont3_chkList li input[type="checkbox"] + label .valueCont{font-size: 13px; letter-spacing: -0.39px; margin: 0 0 0 auto; line-height: 1.1px;}
	.cont3_chkList li input[type="checkbox"] + label .valueCont::before{left: -18px; font-size: 13px; letter-spacing: -0.39px;}
	.cont3_chkList li input[type="checkbox"] + label .valueCont span{font-size: 17px; letter-spacing: -0.51px; margin-right: 1px;}
	
	.buy_cont4 .grayForm{padding: 16px;}
	.buy_cont4 .termChk li input[type="checkbox"] + label{height: 16px; font-size: 15px; letter-spacing: -0.45px; padding-left: 24px; background: url('/resources/homepage/img/m_buy_chkBox.png') left center no-repeat; background-size: 16px 16px;}
	.buy_cont4 .termChk li input[type="checkbox"]:checked + label{background: url('/resources/homepage/img/m_buy_chkBox_on.png') left center no-repeat; background-size: 16px 16px;}
	.buy_cont4 .termChk .require.on input[type="checkbox"] + label{background: url('/resources/homepage/img/m_buy_chkBox_red.png') left center no-repeat; background-size: 16px 16px;}
	.buy_cont4 .termChk .require.on input[type="checkbox"]:checked  + label{background: url('/resources/homepage/img/m_buy_chkBox_on.png') left center no-repeat; background-size: 16px 16px;}
	.buy_cont4 .termChk li .btn_detail{font-size: 13px; letter-spacing: -0.39px;}
	
	.buy_wrap .btnCont .goAppBtn{margin: 120px 0 200px; width: 232px; height: 42px; background: #001248; font-family: 'Gmarket Sans' !important; font-size: 15px; letter-spacing: -0.75px; color: #fff; cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: center; border-radius: 10px; margin: 60px 0 120px;}
	.buy_wrap .btnCont .goAppBtn strong{color: #00e78f; font-weight: bold;}
	
	.termBox{width: 100%; height: 100%; border-radius: 0px;}
	.termBox *{box-sizing: border-box; font-family: 'Pretendard' !important;}
	.termBox .titleCont{height: 60px; padding: 0 24px;}
	.termBox .titleCont h5{font-weight: bold; font-size: 17px; letter-spacing: -0.51px;}
	.btn_popClose{width: 20px; height: 20px; background: url('/resources/homepage/img/buy_popClose.png') no-repeat; background-size: 20px 20px; cursor: pointer; user-select: none;}
	.termBox .txtCont{width: 100%; height: calc(100% - 128px); padding: 24px 24px 30px;}
	.termBox .txtCont .txtBox{ padding-right: 0;}
	.termBox .txtCont .txtBox p{word-break: keep-all; display: none;}
	.termBox .okayBox{height: 68px;}
	.termBox .okayBox .btn_okay{font-size: 17px; letter-spacing: -0.51px;}
}

