@charset "utf-8";
.bztop {background-color:#FEF7F4;display: flex;align-items: center;border-radius: 2rem;position: relative;overflow: hidden;}
.bztop .bgimg {width: 37%;text-align: center;}
.bztop .bgimg img {}
.bztop .txtarea {
    padding: 3rem 2rem;
    width: 63%;
    padding-left: 1rem;
}
.txtarea h4 {
    text-align: left;
    margin-bottom: 2rem;
    color: #444;
}
.txtarea h4 span {color: var(--color-main2);}
.txtarea p {font-size:20px;color: #555;word-break: keep-all;}
.txtarea p span {color: var(--color-main2);font-weight: 600;}
.txtarea .call {padding:1rem 2rem;background-color:var(--color-main);color:#fff;display:inline-block;border-radius:2rem;margin-top: 2rem;}
.bz_sec h4 {
    position: relative;
    padding-left: 1rem;
    text-align: left;
}
.bz_sec h4:after {
    content: "";
    position: absolute;
    display: block;
    width: 12px;
    height: 12px;
    background: var(--gradient);
    border-radius: 50%;
    left: 0;
    top: 0;
}
.bzbox {display: grid;grid-template-rows: repeat(2, auto);grid-template-columns: repeat(2, 1fr);gap: 2rem;}
.bzbox li {border:1px solid #ddd; padding:2rem;border-radius: 2rem;}
.bzbox li p {word-break:keep-all}
.bzbox li .tit {color:var(--color-main2); font-size:24px; font-weight: 600; margin-bottom: 1rem;}
.pt_list {display: grid;grid-template-rows: repeat(2, auto);grid-template-columns: repeat(2, 1fr);gap: 2rem;}
.pt_list li {display: flex;align-items: baseline;}
.pt_list li span {background-image: var(--gradient);color:#fff;width:20%;text-align: center;border-radius: 2rem;padding: .5rem;margin-right: 2rem;font-weight: 500;}
.pt_list li p {width:80%}
.accent {
    margin-top: 1rem;
    color: #e74747;
}
.program_photo {display:flex;gap: 4rem;margin-top: 5rem;}
.program_photo li {width:100%; position:relative}
.program_photo li img {width:100%;height:400px;object-fit:cover;object-position:bottom;border-radius: 2rem;}
.program_photo li .txt {text-align:center;background-image:var(--gradient);color:#fff;padding: 1rem 3rem;position: absolute;bottom: -7%;left: 50%;border-radius: 2rem;transform: translateX(-50%);display: inline-block;}
.txt_zone {margin-bottom:2rem}
.txt_zone .s_tit {margin-top:0}
.txt_zone ul {list-style: circle;}
.txt_zone li {margin-left: 1rem;word-break: keep-all;}
.txt_zone li + li {margin-top:.5rem}
.txt_zone li::marker {color: var(--color-main2);}
.img_zone ul {display: flex;gap: 2rem;justify-content: center;}
.img_zone li {width: 50%;height: 320px;border-radius: 2rem;overflow: hidden;display: flex;align-items: center;justify-content: center;}
.img_zone li img {width:100%;height: 100%;object-fit: cover;object-position: center;}

/* PC */ 
@media only screen and (min-width:1024px) and (max-width: 1500px)  {
	
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/ 
@media (max-width: 1023px) {
    .bztop {display: flex;flex-direction: column-reverse;}
    .bztop .bgimg {width:100%;}
    .bztop .bgimg img {position:relative;left: unset;right: 0;}
    .bztop .txtarea {width:100%;text-align:center }
    .txtarea h4 {text-align:center}
    .txtarea .call {text-align:center}
    .txtarea p br {display:none;}
    .pt_list li span {width:30%; margin-right:1rem}
    .pt_list li p {word-break:keep-all}
    .program_photo {gap:1rem}
    .program_photo li img {height:200px}
    .program_photo li .txt {padding: .5rem 1rem;width: 65%;}
}
	
/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
	.bztop {display: flex;flex-direction: column-reverse;}
    .bztop .bgimg {width:100%;}
    .bztop .bgimg img {position:relative;width:100%;left: unset;right: -5%;}
    .bztop .txtarea {width:100%}
    .txtarea h4 {font-size:22px;text-align:left;margin-bottom: 1.5rem;word-break: keep-all;}
    .txtarea p {font-size:17px; text-align:left}
    .bzbox {
    grid-template-rows: repeat(4, auto);
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
}
    .bzbox li {padding: 1.5rem;}
    .bzbox li .tit {font-size:20px}
    .pt_list {
    grid-template-rows: repeat(4, auto);
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
}
    .pt_list li {width:100%;}
    .program_photo {flex-wrap:wrap;gap:2rem;margin-top: 3rem;}
}