@charset "UTF-8";
@import url('https://www.all-teaching.com/font/pretendard/pretendard-subset.css');
@import url('https://www.all-teaching.com/font/pretendard/pretendard.css');
/*주석 걸어야할 영역! - 작업이 끝난 후 ftp에 업로드 전 주석을 걸어야할 영역임 절대 잊지 말것!-------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
html{font-size: 20px;}
/**{font-family: 'Noto Sans KR', sans-serif; word-break: keep-all; font-weight: 400;}*/
.wrap{ max-width: 1280px;}
@media screen and (max-width: 960px){html{font-size: 16px;}}
@media screen and (max-width: 640px){html{font-size: 14px;}}
/*주석 걸어야할 영역! 끝-----------------------------------------------------------------------------------------------------------------------------------*/
/*공용 기본틀 - 페이지 전체 들어가는 영역--------------------------------------------------------------------------------------------------------------------*/
::-webkit-scrollbar{width:0; height:0;}
* {margin:0; padding:0; box-sizing: border-box; font-size: 1rem; line-height: 1.4rem; font-weight: 400; letter-spacing: -0.05rem; word-break: keep-all;}
body {font-family: 'pretendard', sans-serif;}
li {list-style: none;}
span, strong, em, a, b {text-decoration: none; font-size: inherit; line-height: inherit; font-weight: inherit;}
em {font-style: normal;}
strong {font-weight: 700;}
b {font-weight: 900;}
img {display:inline-block; width:100%; height: auto; vertical-align: top;}
.wrap {margin:0 auto; display: flex;justify-content: center; align-items: flex-start;flex-flow: row wrap;}
.wrap > div {background-color: #fff; color: #212121;}
.sangSec{
position: relative;
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-direction: column;
padding: 4%;
height: 700px;
overflow: hidden;
}
.sangSec .conts {
position: relative;
width: calc(50% - 20px);
height: 100%;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
}
.brs {display: none;}
.noticeInfo{/*환불안내관련 문구*/ width: 100%; text-align: center; margin: 2% 0; font-size:0.8rem; vertical-align: middle;}
.under_ln {text-decoration: underline; text-underline-offset : 6px; text-decoration-thickness : 2px;}
h2 {font-size: 5rem; line-height: 5.4rem; font-weight: 900;}
h3 {font-size: 3.5rem; line-height: 3.9rem; font-weight: 700;}
h4 {font-size: 3rem; line-height: 3.4rem; font-weight: 600;}
h5 {font-size: 2rem; line-height: 2.4rem; font-weight: 500;}
h6 {font-size: 1.5rem; line-height: 1.9rem; font-weight: 500;}
.fs_100 {font-size: 5rem; line-height: 5.4rem;}
.fs_80 {font-size: 4rem; line-height: 4.4rem;}
.fs_70 {font-size: 3.5rem; line-height: 3.9rem;}
.fs_60 {font-size: 3rem; line-height: 3.4rem;}
.fs_50 {font-size: 2.5rem; line-height: 2.9rem;}
.fs_40 {font-size: 2rem; line-height: 2.4rem;}
.fs_30 {font-size: 1.5rem; line-height: 1.9rem;}
.fs_20 {font-size: 1rem; line-height: 1.4rem;}
.fw_9 {font-weight: 900;}
.fw_8 {font-weight: 800;}
.fw_7 {font-weight: 700;}
.fw_6 {font-weight: 600;}
.fw_5 {font-weight: 500;}
.fw_4 {font-weight: 400;}
/*컬러글씨모음*/
.clr_wh {color: #fff;}
.clr_bk {color: #000;}
.pt_clr01 {color: #A802FE;}
.pt_clr02 {color: #8874FF;}
.pt_clr03 {color: #5ECAFF;}
ul.v_con {display: flex; justify-content: space-between; flex-wrap: wrap;}
ul.v_con.two_con li {width: calc(50% - 15px);}
ul.v_con.three_con li {width: calc(33.333% - 15px);}
ul.v_con.four_con li {width: calc(25% - 15px);}
.pointList {display: flex; flex-direction: column;}
.pointList > li {width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; margin: 1% 0;}
.pointList > li:before {content:''; display: inline-block; width:20px; height: 20px; margin-right: 4px; background: url(./img/icon_star.png) no-repeat center / cover;}
.pointList.white > li:before {content:''; display: inline-block; width:20px; height: 20px; background: url(./img/icon_starW.png) no-repeat center / cover;}
/*숨표*/
/*쌍숨표-화이트*/
.sumpyo,
.sumpyo2 {position: relative;}
.sumpyo:before, .sumpyo:after {position: absolute; content:''; background-position: center; background-size: contain; background-repeat: no-repeat;}
.sumpyo:before {top: -20px; left: 0; background-image: url('./img/sumpyoFirst.png');}
.sumpyo:after {bottom: -20px; right: 0; background-image: url('./img/sumpyoLast.png');}
/*싱글숨표-화이트*/
.sumpyo2:before, .sumpyo2::after {position: absolute; content:''; background-position: center; background-size: contain; background-repeat: no-repeat;}
.sumpyo2:before {top: -20px; left: 0; background-image: url('./img/sumpyoFirst2.png');}
.sumpyo2:after {bottom: -20px; right: 0; background-image: url('./img/sumpyoLast2.png');}
/*쌍숨표-블랙*/
.sumpyo.black:before { background-image: url('./img/sumpyoFirst_Bk.png');}
.sumpyo.black:after { background-image: url('./img/sumpyoLast_Bk.png');}
/*싱글숨표-블랙*/
.sumpyo2.black:before { background-image: url('./img/sumpyoFirst2_Bk.png');}
.sumpyo2.black:after { background-image: url('./img/sumpyoLast2_Bk.png');}
/*숨표 끝!*/
/*Info*/
.sangSec.Info{ width: 100%; height:100%; flex-flow: row wrap; justify-content: space-between; align-content: space-between; padding: 0 0 4%;}
.Info .info_box{ width: 100%; display: flex; align-items: center;}
.Info .info_box ul.info_list {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; width: 100%;}
.Info .info_box ul.info_list li.infos {display: flex; justify-content: flex-start; align-items: center; width: 49%; height: 80px; border-bottom: 1px dotted #000;}
.Info .info_box ul.info_list li.infos div p {font-size: 0.8rem; line-height: 1.2rem;}
.Info .info_box ul.info_list li.infos .tit_box {}
.Info .info_box ul.info_list li.infos .tit_box .tit {font-weight: 700; margin: 0 20px 0 0;}
.Info .info_box ul.info_list li.infos .desc_box {}
.Info .info_box ul.info_list li.infos .desc_box p {}
.Info .info_box ul.info_list li.infos .desc_box p span {}
.Info .info_box ul.info_list li.infos .desc_box p span.sub_tit:before { content: '·'; margin-right: 4px;}
.Info > div.cupponList {display: flex; align-items: center; margin-top: 1%; width: 100%; height: 80px; padding: 1%; background-color: #e7242c; color:#fff; border-radius: 10px;}
.Info > div.cupponList.blue {background: #FFFFFF; border: 1px solid #E62C2B; border-radius: 4px;}
.Info > div.cupponList.blue p strong {color: #E62C2B; font-weight: 700;}
.Info > div.cupponList.blue p span {color: #000; font-weight: 400;}
.Info > div.cupponList.blue .discount { display: flex; align-items: center; justify-content: flex-end; width: auto;}
.Info > div.cupponList.blue .discount span { position: relative; margin: 0 20px 0 0; font-size: 1.2rem; line-height: 1.6rem; font-weight: 400; color: #000;}
.Info > div.cupponList.blue .discount span:before {position: absolute; top: 50%; left: -80%; content: ''; color: #E62C2B; font-size: 0.8rem; font-weight: 600; transform: translateY(-50%);}
.Info > div.cupponList.blue .discount span:after { position: absolute; top: 50%; left: 50%; content: ''; width: 120%; height: 100%; background: url(img/Arrow_1.png) center no-repeat; background-size: contain; transform: translate(-50%, -50%);}
.Info > div.cupponList.blue .discount strong { font-size: 1.2rem; line-height: 1.6rem; font-weight: 700; color: #E62C2B;}
.cupponList > p { flex:1; display: flex; flex-flow: row wrap; align-items: center; padding-left: 2%; font-size: 0.8rem; line-height: 1.2rem;}
.cupponList > p > span {margin-right: 10px;}
.cupponList > p > strong {margin-right: 10px;}
.cupponList > div { width:20%; height:100%;}
.cupponList > div > a { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; color: #e7242c; background-color: #fff; border-radius: 10px; box-shadow: 1px 1px 3px 1px rgba(0,0,0,0.3); font-weight: 700;}
/*Info end!*/
.sangSec .pt_text {position: absolute; top: 0; right: 0; width: auto; z-index: 99999;}
.sangSec .tit {z-index: 999999;}
/*공용 기본틀 end!-----------------------------------------------------------------------------------------------------------------------------------------*/
/*cont01*/
.sangSec.cont01 {background: url(img/ruaf01.jpg) center no-repeat; background-size: cover;}
.sangSec.cont01 .title_con {position: absolute; top: 50%; right: 0; padding: 20px; background: #15A99B; transform: translateY(-50%);}
.sangSec.cont01 .title_con p {color: #fff;}
.sangSec.cont01 .title_con h2 {font-size: 2.5rem; line-height: 2.9rem; font-weight: 700; color: #fff;}
/*cont01 end!*/
/*cont02*/
.sangSec.cont02 {background: url(img/ruaf02.jpg) center no-repeat; background-size: cover;}
.sangSec.cont02 .desc_con {position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(33,33,33,.8); padding: 25px 50px;}
.sangSec.cont02 .desc_con p {color: #fff;}
/*cont02 end!*/
/*cont03*/
.sangSec.cont03 {}
.sangSec.cont03 h3 {font-size: 2.5rem; line-height: 2.9rem;}
.sangSec.cont03 ul.v_con {}
.sangSec.cont03 ul.v_con li {display: flex; justify-content: space-between; align-items: center; height: 250px; margin: 20px 0 0 0; padding: 0 15px; border: 1px solid #212121;}
.sangSec.cont03 ul.v_con li .desc_con {display: flex; flex-direction: column; width: calc(50% - 5px); height: 100%;}
.sangSec.cont03 ul.v_con li .desc_con h5 {border-bottom: 1px solid #212121; height: 30%;}
.sangSec.cont03 ul.v_con li .desc_con h5 span {display: inline-block; padding: 15.5% 10px 5px 10px; background: #212121; color: #fff; font-size: 1rem; line-height: 1.4rem;}
.sangSec.cont03 ul.v_con li .desc_con p {display: flex; align-items: center; border-bottom: 1px solid #212121; height: 65%;}
.sangSec.cont03 ul.v_con li .desc_con p span {}
.sangSec.cont03 ul.v_con li .img_con {width: calc(50% - 5px);}
.sangSec.cont03 ul.v_con li .img_con img {width: 100%;}
/*cont03 end!*/
/*cont04*/
.sangSec.cont04 {background: #15A99B;}
.sangSec.cont04 h4 {font-size: 2rem; line-height: 2.4rem; color: #fff;}
.sangSec.cont04 .main_con {display: flex; align-items: center; width: 100%;}
.sangSec.cont04 .main_con img {width: auto;}
.sangSec.cont04 .main_con img:nth-child(1) {}
.sangSec.cont04 .main_con img:nth-child(2) {}
.sangSec.cont04 p {margin: 20px 0 0 0; color: #fff;}
/*cont04 end!*/
/*cont05*/
.sangSec.cont05 {flex-direction: row; padding: 0;}
.sangSec.cont05 .conts {background: #fff;}
.sangSec.cont05 .cont01 {background: url(img/ruaf06.jpg) center no-repeat; background-size: cover;}
.sangSec.cont05 .cont02 {display: flex; justify-content: center; align-items: center; padding: 4%;}
.sangSec.cont05 .cont02 h4 {font-size: 2rem; line-height: 2.4rem; font-weight: 700;}
.sangSec.cont05 .cont02 p {margin: 50px 0 0 0;}
/*cont05 end!*/
/*cont06*/
.sangSec.cont06 {background: #15A99B;}
.sangSec.cont06 h4 {font-size: 2rem; line-height: 2.4rem; color: #fff;}
.sangSec.cont06 > p {color: #fff; margin: 20px 0 0 0;}
.sangSec.cont06 p span {font-weight: 700;}
.sangSec.cont06 ul.v_con {}
.sangSec.cont06 ul.v_con li {position: relative;}
.sangSec.cont06 ul.v_con li img {}
.sangSec.cont06 ul.v_con li .desc_con {position: absolute; bottom: 0; left: 0; display: flex; justify-content: center; align-items: center; padding: 15px 30px; background: rgba(33,33,33,.9);}
.sangSec.cont06 ul.v_con li .desc_con p {text-align: center; color: #fff;}
/*cont06 end!*/
/*cont07*/
.sangSec.cont07 {flex-direction: row;}
.sangSec.cont07 .conts {position: relative;}
.sangSec.cont07 .cont01 {display: flex; justify-content: center; align-items: center;}
.sangSec.cont07 .cont01 .title_con {}
.sangSec.cont07 .cont01 .title_con h4 {font-size: 2rem; line-height: 2.4rem; font-weight: 700;}
.sangSec.cont07 .cont01 .title_con h6 {font-size: 1rem; line-height: 1.6rem; font-weight: 500; margin: 15px 0 0 0;}
.sangSec.cont07 .cont01 .title_con p {font-size: 0.8rem; line-height: 1.2rem; font-weight: 400; margin: 50px 0 0 0;}
.sangSec.cont07 .list_con {position: relative; width: 100%; overflow: hidden; z-index: 99999;}
.sangSec.cont07 .list_con .list {display: flex; align-items: center; width: 600%; height: 100%; animation: roll 20s linear infinite;}
.sangSec.cont07 .list_con .list li {display: flex; align-items: center; width: 16.666%; height: 100%; background: #fff;}
.sangSec.cont07 .list_con .list li img {width: auto; height: 100%;}
@keyframes roll {
0%{transform: translateX(0);}
100%{transform: translateX(-50%);}
}
/*cont07 end!*/
/*cont08*/
.sangSec.cont08 {flex-direction: row; padding: 0;}
.sangSec.cont08 .pt_text {}
.sangSec.cont08 .conts {}
.sangSec.cont08 .cont01 {width: 50%; overflow: hidden;}
.sangSec.cont08 .cont01 img {}
.sangSec.cont08 .cont02 {width: 50%; padding: 4%; background: #E5E6E8;}
.sangSec.cont08 .cont02 h6 {font-size: 1rem; line-height: 1.4rem; font-weight: 800; color: #212121;}
.sangSec.cont08 .cont02 h4 {margin: 20px 0 0 0; font-size: 2rem; line-height: 2.4rem; font-weight: 800; color: #212121;}
.sangSec.cont08 .cont02 p {font-size: 0.8rem; line-height: 1.2rem; font-weight: 400; color: #212121;}
.sangSec.cont08 .cont02 p:nth-child(1) {margin: 30px 0;}
/*cont08 end!*/
/*cont09*/
.sangSec.cont09 {}
/*cont09 end!*/
/*cont10 start!*/
.sangSec.cont10 {}
/*cont10 end!*/
/*cont11 start!*/
.sangSec.cont11 {}
/*cont11 end!*/
/*cont12 start!*/
.sangSec.cont12 {}
/*cont12 end!*/
/*cont13 start!*/
.sangSec.cont13 {}
/*cont13 end!*/
/*cont14 start!*/
.sangSec.cont14 {}
/*cont14 end!*/
/*cont15 start!*/
.sangSec.cont15 {}
/*cont15 end!*/