/* layout CSS */
.wrap { max-width: 900px; height: 100%; margin: 0 auto;}
main { padding-top: 3.125rem; padding-bottom: 5.125rem; position: relative; z-index: 1;}

/* heaer CSS */
header { width: 100%; height: 5.625rem; padding-top: 2.5rem; display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 2;}
header h1 a { display: block; width: 5rem; height: 3.125rem; background: url(../../images/logo.png) no-repeat center / 4.375rem auto;}
header .menuContainer { /*flex: 1;*/ display: flex; justify-content: space-between; align-items: center;}
header nav > ul > li,
header .gUtils > li { float: left;}
header nav > ul > li { margin: 0 1rem; padding: 0 1rem; position: relative;}

/*
header nav > ul > li > ul { display: none; padding-left: 1rem; padding-right: 1rem; position: absolute; left: 50%; transform: translateX(-50%); bottom: -180%; background-color: #000; white-space: nowrap; border-radius: 2rem;}
*/

header nav > ul > li > ul {     display: none;
  padding-left: 1rem;
  padding-right: 1rem;
  position: absolute;
  left: 50%;
  transform: translateX(-20%);
  bottom: -180%;
  background: #000;
  white-space: nowrap;
  border-radius: 2rem;
  /*border-color: #000000;
  border: double;*/}

header nav > ul > li > ul li { display: inline-block;}
/*
header nav > ul > li > ul li a { display: block; padding: .5rem 1rem; color: #fff;}
*/
header nav > ul > li > ul li a { display: block; padding: .5rem 1rem; /*color: #585858;*/color: #fff; }
header nav > ul > li.on > ul { display: block;}

header .gUtils > li button { display: block; width: 3rem; height: 3rem; background: #fff no-repeat center / 2rem auto;}
header .gUtils .search { background-image: url(../../images/ic_search.png);}
header .gUtils .myPage { background-image: url(../../images/ic_user.png);}
header .gUtils .lang { background-image: url(../../images/ic_lang.png);}
header .gUtils .menuBtn { display: none; background-image: url(../../images/ic_menu.png);}
header .menuBtn { display: none;}

.langContainer { position: relative;}
.langContainer > ul { display: none; position: absolute; top: 3rem; left: 50%; transform: translateX(-50%); border: 1px solid #000; background-color: #fff; padding: .25rem 1rem; border-radius: 1rem; z-index: 1;word-break: keep-all;}
.langContainer > ul li { padding: .25rem; border-bottom: 1px solid #ccc;}
.langContainer > ul li:last-child { border-bottom: none;}
.langContainer > ul li a { font-weight: 700;}
.langContainer.on > ul { display: block;}

.myMenu { position: relative;}
.myMenu input[type=checkbox] { display: none;}
.myMenu input[type=checkbox] + label {  height: 3rem; line-height: 3rem; padding-right: 2rem; background-image: url('../../images/open.png'); background-repeat: no-repeat; background-position: right center; background-size: auto 1.3rem; cursor: pointer;}
.myMenu input[type=checkbox] + label > span { font-weight: bold;}
.myMenu input[type=checkbox]:checked + label { background-image: url('../../images/close.png');}
.myMenu .menuitems { display: none; position: absolute; top: 3rem; border: 1px solid #000; background-color: #fff; padding: .25rem 1rem; border-radius: 1rem; z-index: 1;}
.myMenu .menuitems li { padding: .25rem; border-bottom: 1px solid #ccc;}
.myMenu .menuitems li:last-child { border-bottom: none;}
.myMenu .menuitems li a { font-weight: 700;}
.myMenu input[type=checkbox]:checked ~ .menuitems { display: block;}

/* index CSS */
.index main h2 { text-align: center; margin-bottom: 1em;}
.index main .mainItem { display: flex; flex-direction: column; position: relative; text-align: center;}
.index main .mainItem .mainImg { order: -1;}
.index main .mainItem dt { font-size: 3.125rem; padding-top: 3.5rem; padding-bottom: 1rem; line-height: 1em; letter-spacing: -0.05em
  ;}
.index main .mainItem p { margin-top: 2rem;}
.index main .cntList h2 { padding-top: 5rem;}
.index main .cntList h2 .badge { margin-left: .5rem; vertical-align: middle;}
.index main .changbiApply { margin-top: 5rem; margin-bottom: 6rem; display: flex; justify-content: space-between; align-items: flex-end;}
.index main .changbiApply img { height: 14.25rem;}
.index main .changbiApply .mainBtn { padding: 1rem 2rem; width: auto;}

.index main .weekly { margin-top: 6rem; padding: 1rem 1rem 2rem; background-color: #f5f9fe;}
.index main .weekly h2 { margin-top: 1rem; font-size: 4rem; padding-top: 0; text-align: left; color: #3982e9;}
.index main .weekly h2 sup { display: inline-block; vertical-align: middle; margin-top: -1rem; font-size: 1rem; letter-spacing: 0; line-height: 1.5em; color: #aac9f5;}
.index main .weekly .weekInfo .thumImg { float: right; width: 60%; margin-bottom: 3rem;}
.index main .weekly .weekInfo { margin-bottom: 3rem;}
.index main .weekly .weekInfo li { margin-bottom: 1rem;}
.index main .weekly .weekInfo .sizeXX { line-height: 1.3em;}
.index main .weekly .weekInfo + .basicList { clear: both; border-color: #3982e9;}
.index main .weekly .weekInfo + .basicList li { border-color: #3982e9;}
.index main .weekly .weekInfo + .basicList li:last-child { border: none;}
.index main .weekly .weekInfo + .basicList li a .title,
.index main .weekly .weekInfo + .basicList li a { color: #3982e9;}

/* footer CSS */
footer { padding-bottom: 5rem; font-size: .875rem; text-align: center; border-top: 1px solid #333;}
footer h3 { margin-top: 1rem; margin-bottom: .5rem;}
footer > ul { display: flex; justify-content: space-between; padding-left: 8rem; padding-right: 8rem; margin-top: 2rem; margin-bottom: 2rem; line-height: 1.5rem;}
footer .companyInfo { margin-top: 3rem; letter-spacing: -0.04em; line-height: 1.7rem;}
footer .companyInfo small { display: block; margin-top: 2rem;}

/* login CSS */
.login { text-align: center;}
.login .loginForm { max-width: 400px; margin: 5rem auto;}
.login .loginForm label { margin-top: 1rem;}
.login .loginForm div:first-child { margin-bottom: 3rem;}
.login .loginForm .containerChk { display: block; margin-top: 1.8rem; margin-bottom: 4rem;}

/* Subpage Design CSS */
main .mainBtn,
main .outlineBtn { padding: 1rem; width: 100%;}
main .mainBtn + .outlineBtn { margin-top: 1.5rem;}
main p a { text-decoration: underline;}
.colS { width: 400px; margin: 5rem auto;}
main.cbCnt { padding-top: 4rem;}

.stepHead { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3rem;}
.stepHead .stepBar { text-align: right;}
.stepHead .stepBar .step { font-weight: 500; font-size: 1rem; color: #333;}
.stepHead .stepBar .bar { position: relative; border: 1px solid #000; width: 8rem; height: .7rem;}
.stepHead .stepBar .bar::after { content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 33.3333%; background: #000;}
.stepHead .stepBar .bar.step2::after { width: 66.6666%;}
.stepHead .stepBar .bar.step3::after { width: 100%;}
.stepHead + form h3 { margin-top: 3rem;}
.stepHead + form .wrapItem:last-of-type,
.stepHead + form .inputWrap:last-of-type,
.stepHead + form .inputWrap:last-of-type + p { margin-bottom: 4rem;}
.stepHead + form h3 ~ label,
.stepHead + form div + label { margin-top: 1rem;}
.stepHead + form select:first-of-type + label { margin-top: 1rem;}
.formFoot { margin-top: 2rem; text-align: center;}
.formFoot button,
.formFoot a { text-decoration: underline;}

.selWay { margin-bottom: 4rem;}
.selWay .outlineBtn { width: 48%; height: 20rem;}
.wrapItem.address > * { flex: 1;}
.wrapItem.address .outlineBtn { margin-left: 1rem;}

.userOK h2 { margin-bottom: .5rem;}
.userOK a { margin-top: 1.5rem; margin-bottom: 1.5rem; padding: 1rem;}
.userOK a.mainBtn { margin-top: 4rem;}

.cbCnt h2 { color: #333; margin-bottom: 2rem;}
.cbCnt .cntList { margin-bottom: 4rem;;}
.cbCnt .cntList .stepHead { justify-content: center;}
.cbCnt .selWay .outlineBtn { margin-top: 1rem; height: 15rem;}
.cbCnt > .clearFix:first-child .f-right { text-decoration: underline; margin-left: 1rem;}

.cbCnt .cntContainer h2,
.cbCnt .cntList h2 { text-align: center; margin-bottom: 5rem; line-height: 1.3em;}
.cbCnt .cntContainer h3 { text-align: center; margin-bottom: 1rem;}
.cbCnt .cntList h3 { margin-bottom: 1rem;}
.cbCnt .cntContainer h3 sub { display: block; margin: .5rem 0;}
.cbCnt .cntList li { position: relative;}
.cbCnt .cntList li a + .outlineBtn { position: absolute; width: auto; right: 0; top: 50%; transform: translateY(-50%); padding: .7rem 1.5rem;}

.cbCnt .basicList.order { border: none;}
.cbCnt .basicList.order .noOrder { text-align: center;}
.cbCnt .basicList.order li { padding: 1.5rem 0;}
.cbCnt .basicList.order .thumnail { padding: 0; width: 13.125rem; height: 13.125rem; font-size: 0; background: #f3f3f3 url(../../images/noImg.png) no-repeat center / 100% auto; border: 1px solid #000;}
.cbCnt .basicList.order dl { position: relative; margin-top: -0.5rem; margin-left: 15rem; min-height: 13.6rem; padding-bottom: 2.5rem;}
.cbCnt .basicList.order dl dt a,
.cbCnt .basicList.order dl dd { padding: .5rem 0; line-height: 1em;}
.cbCnt .basicList.order dl dt a { line-height: 1.3em;}
.cbCnt .basicList.order dl dd:last-child { position: absolute; bottom: 0;}

.cbCnt .orderInfo h2 { margin-bottom: 2rem;}
.cbCnt .orderInfo h2 > img { display: block; border: 1px solid #000; margin-bottom: 3rem;}
.cbCnt .orderInfo dl { line-height: 2rem; margin-bottom: 3rem;}
.cbCnt .orderInfo dl dt.f-left { width: 7rem;}
.cbCnt .orderInfo .basicList { margin-top: .5rem;}
.cbCnt .orderInfo .basicList li { padding: .4rem 0;}
.cbCnt .orderInfo .extraPrice { padding-top: .5rem; padding-bottom: .5rem;text-align: right;}

.cbCnt .orderInfo .wrapItem.Read { margin-top: 4rem; margin-bottom: 4rem;}
.cbCnt .orderInfo .wrapItem.Read > img { width: 45%; border: 1px solid #333;}
.cbCnt .orderInfo .wrapItem.Read > .flex1 { margin-left: 2rem;}
.cbCnt .orderInfo .wrapItem.Read h2 { margin-top: .1rem; margin-bottom: 4rem; text-align: left;}
.cbCnt .orderInfo .wrapItem.Read h2 .sizeXX { line-height: 1.3em;}
.cbCnt .orderInfo .wrapItem.Read h2 sub { display: block; margin-top: 1rem; font-weight: 500; line-height: 1.5em;}
.cbCnt .orderInfo .wrapItem.Read .colItem { margin-top: 1.5rem;}
.cbCnt .orderInfo .wrapItem.Read .colItem select { width: auto; min-width: 15rem;}
.cbCnt .orderInfo .wrapItem.Read + h3 { text-align: left;}
.cbCnt .orderInfo .wrapItem.Read .wrapItem { margin-top: 3rem;;}
.cbCnt .orderInfo .wrapItem.Read .wrapItem .price { margin-right: 1rem;}
.cbCnt .orderInfo .wrapItem.Read .wrapItem .price .txSans { display: block;}
.cbCnt .orderInfo .wrapItem.Read .wrapItem .mainBtn { width: auto; padding-left: 2rem; padding-right: 2rem; white-space: nowrap;}

.cbCnt .selWay.forOrder .outlineBtn { height: auto;}
.cbCnt .selWay.coupon .outlineBtn { align-items: flex-start; flex-direction: column; height: auto;}
.cbCnt .selWay.coupon .outlineBtn .cpName { align-self: stretch; text-align: left; line-height: 2.2rem; border-bottom: 1px solid #707070; margin-bottom: .4rem;}
.cbCnt .selWay.coupon .outlineBtn.disable { opacity: .3; cursor: auto;}

.cbCnt .termItem { margin-bottom: 4rem;}
.cbCnt .termItem h3 { margin-bottom: 2rem;}
.cbCnt .termItem h4 { margin-top: 1rem; margin-bottom: 1rem;}
.cbCnt .termFoot select { width: auto; min-width: 30rem; margin-bottom: 2rem;}
.cbCnt .termFoot .outlineBtn { width: auto; padding-left: 2rem; padding-right: 2rem;}

.cbCnt .centerMain .basicList { border-top: none;}
.cbCnt .centerMain .basicList li a { margin-top: 1rem; margin-bottom: 1rem;}
.cbCnt .centerMain .basicList li a .title { margin-bottom: .5rem;}

ul.faq {  margin: 0;}
ul.faq li { padding: .5rem 0; border-top:1px solid #333;}
ul.faq li:first-child { border-top:0 none;}
ul.faq li:last-child { border-bottom:1px solid #333;}
ul.faq li .question { display:block; padding: 1rem 0; color:#000; font-weight: 700; background: url(../../images/arrow_down.png) no-repeat right / auto 1rem;}
ul.faq li .question::before,
ul.faq li .answer::before { font-weight: 900; display: inline-block; margin-right: .5rem;}
ul.faq li .question::before { content: 'Q.';}
ul.faq li .answer::before { content: 'A.';}
ul.faq li.active .answer { padding: 1rem 0; border-top: 1px solid #dedede;}
ul.faq li.active .question { background-image: url(../../images/arrow_up.png);}

.cbCnt .giftBook { margin-bottom: 1rem;}
.cbCnt .giftBook + .basicList li { padding: .5rem 0;}
.cbCnt .giftBook + .basicList li button { text-decoration: underline;}
.cbCnt .giftBook + .basicList + button.sizeR { margin-top: .5rem; padding-top: .5rem; padding-bottom: .5rem;}
.cbCnt .giftBook ~ .info { margin-top: 3rem; margin-bottom: 3rem;}
.cbCnt .giftBook ~ .info p { margin-bottom: 2rem;}

.cbCnt .basicList.bookList,
.cbCnt .basicList.bookList li { border: none;}
.cbCnt .basicList.bookList li { float: left; width: 30%; margin-right: 5%; margin-bottom: 3rem;}
.cbCnt .basicList.bookList li:nth-child(3n) { margin-right: 0;}
.cbCnt .basicList.bookList li a { display: block; padding-right: 0;}
.cbCnt .basicList.bookList li a img { margin-bottom: 1rem;}
.cbCnt .basicList.bookList.read li { margin-bottom: 1rem;}
.cbCnt .basicList.bookList.read li img { border: 1px solid #333;}
.cbCnt .basicList.bookList.read li .price { display: block; margin-top: .5rem;}

.cbCnt h2.cbBook { text-align: center; margin: .5rem auto 4rem; width: 16rem; }
.cbCnt h2.cbBook img { margin-bottom: 1rem;}
.cbCnt .bookCnt { margin-top: .5rem;}
.cbCnt .bookCnt h2 { text-align: center;}
.cbCnt .bookCnt h3 { margin-bottom: 4rem; line-height: 1.3em;}
.cbCnt .bookCnt h4 { margin-bottom: .5rem;}
.cbCnt .bookCnt .category { display: inline-block; padding: .5rem 2rem; border: 1px solid #333; border-radius: 2rem;}
.cbCnt .bookCnt section.cntContainer > p { text-indent: 1rem; text-align: justify;}
.cbCnt .bookCnt section.cntContainer > p + h4 { margin-top: 4rem;}
.cbCnt .bookCnt .quote { padding: 4rem 2rem;}
.cbCnt .bookCnt .footNote { margin-top: 4rem; margin-bottom: 6rem; padding-top: 1rem; font-size: 0.875rem; border-top: 1px solid #333; line-height: 1.7rem;}
.cbCnt .bookCnt .supNum { display: inline-block; margin-right: .5rem;}
.cbCnt .bookCnt .supNum::before { content:'[';}
.cbCnt .bookCnt .supNum::after { content:']';}
.cbCnt .bookCnt p .supNum { margin: 0; margin-top: -0.5rem; padding: 0; vertical-align: super; text-indent: .3rem; margin-right: .3rem; font-size: .75rem;}
.cbCnt .bookCnt p .supNum { margin: 0; margin-top: -0.5rem; padding: 0; vertical-align: super; text-indent: .3rem; margin-right: .3rem; font-size: .75rem;}

.cbCnt .bookCnt.disable { position: relative;}
.cbCnt .bookCnt.disable .modalBg { 
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  background: rgba(255,255,255,.9); 
  background:  linear-gradient(
    to bottom,
    rgba(255,255,255,.3) 20%, 
    rgba(255,255,255,.7) 40%, 
    rgba(255,255,255,1) 100%);
}
.cbCnt .bookCnt.disable .modalWin { position: absolute; width: 100%; top: 50%; transform: translateY(-50%); text-align: center; z-index: 2; background: #fff; border: 1px solid #000;}
.cbCnt .bookCnt.disable .modalWin h2 { margin-top: 3rem; margin-bottom: .5rem;}
.cbCnt .bookCnt.disable .modalFoot { display: flex; width: 60%; margin: 3rem auto;} 

.cbCnt h2.writer { margin-bottom: 0; text-align: center;}
.cbCnt h2.writer + h3 { margin-top: 1rem; margin-bottom: 1rem;}
.cbCnt h2.writer > span { display: block;}
.cbCnt h2.writer .writerPic { margin: 1rem auto; width: 6.25rem; height: 6.25rem; border: 1px solid #333; border-radius: 50%; overflow: hidden; background: url(../../images/pic_user.png) no-repeat center / 100% auto; font-size: 0;}
.cbCnt h2.writer sub { font-weight: normal;}
.cbCnt .writerIntro { margin-top: 3rem; margin-bottom: 5rem;}
.cbCnt .writerIntro p { margin-bottom: 2rem;}

.cbCnt .bookCnt.week h2 { margin-bottom: 3rem; text-align: center;}
.cbCnt .bookCnt.week .weekInfo li { margin-bottom: .5rem;}
.cbCnt .bookCnt.week .weekInfo li.sizeXX { line-height: 1.5em;}
.cbCnt .bookCnt.week .mailing { padding: 3rem 0;}
.cbCnt .bookCnt.week .mailing a { text-decoration: none;}
.cbCnt .bookCnt.week .mailing .mainBtn { width: auto; padding-left: 2rem; padding-right: 2rem; max-width: 20rem; }
.cbCnt .bookCnt.week .category { background-color: #000; color: #fff;}
.cbCnt .bookCnt.week .rights { margin-top: 5rem;}

.cbCnt .week.type01 h2 { text-align: left; padding: 1.5rem .7rem 2rem; line-height: 1em; color: #fff; background-color: #3982e9;}
.cbCnt .week.type01 h2 .badge { padding-top: 0; line-height: 1em; vertical-align: super; background-color: transparent;}
.cbCnt .week.type01 .mailing { display: flex; align-items: flex-end; overflow: hidden;}
.cbCnt .week.type01 .mailing p.txSans { flex: 1;}
.cbCnt .week.type01 .mailing .mainBtn { margin-left: 0; margin-top: 1rem; display: block;}
.cbCnt .week.type01 .mailing .thumPic { width: 60%; margin-left: 4rem;}
.cbCnt .week.type01 .mailing .thumPic img { width: 100%;}

.cbCnt .week.type02 h2,
.cbCnt .week.type02 h2 + section.cntContainer { background-color: #f5f9fe;}
.cbCnt .week.type02 h2 { margin-bottom: 0; text-align: left; padding: 1.5rem 1rem 2rem; line-height: 1em;}
.cbCnt .week.type02 h2 .badge { padding-top: 0; padding-left: 0; line-height: 1em; vertical-align: super; background-color: transparent; color: #3982e9;}
.cbCnt .week.type02 h2 + section.cntContainer { padding: 1rem;}
.cbCnt .week.type02 .weekInfo .txBlue { display: inline-block; border-top: 3px solid #3982e9;}
.cbCnt .week.type02 .mailing { display: flex; align-items: flex-end; flex-direction: column; overflow: hidden;}
.cbCnt .week.type02 .mailing p.txSans { order: 2;}
.cbCnt .week.type02 .mailing .mainBtn { margin-left: 0; max-width: none; margin-top: 1rem; display: block;}
.cbCnt .week.type02 .mailing .thumPic { order: 1; width: 70%; margin-bottom: 1rem;}
.cbCnt .week.type02 .mailing .thumPic img { width: 100%;}

.cbCnt .search { position: relative; }
.cbCnt .search input { border-width: .4rem; font-size: 2rem; padding-left: 1rem; padding-right: 3rem;}
.cbCnt .search button { position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 3rem; height: 3rem; background: url(../../images/ic_searchB.png) no-repeat center / 60% auto;}

.cbCnt .wrapItem.radioCustom { margin-top: 1rem; margin-bottom: 1rem;}
.cbCnt .wrapItem.radioCustom .containerChk { margin-top: .5rem; margin-bottom: .5rem; padding-left: 3.3rem; padding-right: 1.5rem; margin-right: 1rem; height: 3rem; line-height: 3rem; color: #000; white-space: nowrap;}
.cbCnt .wrapItem.radioCustom .containerChk:last-child { margin-right: 0;}
.cbCnt .wrapItem.radioCustom .containerChk .checkmark { width: 100%; height: 3rem; border: 1px solid #333; border-radius: 2rem; z-index: -1; background-color: #fff;}
.cbCnt .wrapItem.radioCustom .containerChk .checkmark::after { display: block; border: .5rem solid #fff; outline: 1px solid #000; width: .5rem; height: .5rem; background-color: #fff; transform: rotate(45deg); transform-origin: 25% 140%; border-radius: 50%;}
.cbCnt .wrapItem.radioCustom .containerChk input:checked ~ .checkmark.radio { background-image: none; background-color: #000;}
.cbCnt .wrapItem.radioCustom .containerChk input:checked ~  i { color: #fff; white-space: nowrap;}
.cbCnt .wrapItem.radioCustom .containerChk input:checked ~  .checkmark::after { background-color: #000;}
.cbCnt .wrapItem.radioCustom.period { align-items: flex-end;}
.cbCnt .wrapItem.radioCustom.period > label { margin-bottom: .5rem; margin-right: 2rem;}
.cbCnt .wrapItem.radioCustom.period > .sizeXX { color: #666; margin-right: 1rem;}
.cbCnt .wrapItem.radioCustom.period input[type='text'] { border-color: #dbdbdb; padding-right: 1rem; background: url(../../images/arrow_down.png) no-repeat right / auto 1rem;}
.cbCnt .wrapItem.listHead { margin-top: 4rem;}
.cbCnt .wrapItem.listHead .colItem { margin-left: 1rem; margin-right: 0;}
.cbCnt .wrapItem.listHead .colItem select { min-width: 13rem; border: none;}

.cbCnt .intro.cb h2 { position: relative; height: 30rem; color: #fff; background: url(../../images/pic_intro.png) no-repeat center / cover;}
.cbCnt .intro.cb h2 > span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1;}
.cbCnt .intro.cb h2 > span sub { display: block; margin-top: .5rem;}
.cbCnt .intro.cb h2::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.4);}
.cbCnt .intro h3 { text-align: left;}
.cbCnt .intro h3 + p { margin-bottom: 4rem;}
.cbCnt .comment blockquote { text-align: center; margin-bottom: 4rem;}
.cbCnt .comment blockquote cite { display: block;}
.cbCnt .intro.person h3 img { display: block; width: 6rem; height: 6rem; border-radius: 50%; border: 1p solid #333; margin-bottom: 1rem;}
.cbCnt .intro.person h3 sub { font-weight: 500; line-height: 1em;}
.cbCnt .intro.person hr { border-color: #333;}

.cbCnt .colS.orderMake { margin: 0;}
.cbCnt .colS.orderMake h2,
.cbCnt .colS.orderMake h3 { text-align: left;}
.cbCnt .colS.orderMake h2 img { height: 14rem;}
.cbCnt .colS.orderMake .listHead { padding-top: 0; padding-bottom: 1.5rem;}
.cbCnt .colS.orderMake .listHead .f-right { margin-top: .2rem;}
.cbCnt .colS.orderMake .basicList .f-left + button { margin-left: .5rem; line-height: 2em;}
.cbCnt .colS.orderMake .listFoot { margin-top: .5rem;;}
.cbCnt .colS.orderMake .listFoot button { padding-top: .5rem; padding-bottom: .5rem;}
.cbCnt .colS.orderMake .listFoot .extraPrice { margin-bottom: 1.5rem;}
.cbCnt .colS.orderMake .buyerInfo { padding-left: 8rem;}
.cbCnt .colS.orderMake label + div,
.cbCnt .colS.orderMake label + div + div{ margin-bottom: 1rem;}
.cbCnt .colS.orderMake h3 + label.containerChk { margin-bottom: 1rem;}
.cbCnt .colS.orderMake .basicList.noline li { padding-top: 0;}
.cbCnt .colS.orderMake .totalPrice { display: block; margin-top: .5rem; padding-top: 1.5rem; border-top: 1px solid #333; text-align: right;}

.cbCnt .paySel h3 { text-align: left;}
.cbCnt .paySel h3 sub { display: inline-block; font-weight: 500; margin-left: .5rem;}
.cbCnt .paySel .wrapItem.radioCustom { flex-wrap: wrap; justify-content: flex-start;}
.cbCnt .paySel .orderMake { margin-top: 1rem;}

.cbCnt .payProgress { border: 1px solid #000;}
.cbCnt .payProgress h3,
.cbCnt .payProgress h3 + p { padding: 2rem;}
.cbCnt .payProgress h3 { border-bottom: 1px solid #000; line-height: 1.3em;}
.cbCnt .payProgress .basicList { width: 60%; padding: 0 2rem 2rem;}
.cbCnt .payProgress .basicList li:first-child { margin-bottom: 1rem;}
.cbCnt .payConfirm { margin-top: 2rem; display: flex; align-items: center;}
.cbCnt .payConfirm .totalPrice { flex: 1; text-align: center;}
.cbCnt .payConfirm .mainBtn { width: auto; padding: 1.2rem 3.5rem;}



.cntContent .cntContent__content ol {
    list-style-type: decimal;
    margin: 4px 0 20px 10px;
    word-break: unset;
   text-decoration:unset;
}

.cntContent .cntContent__content ol li{
    word-break: normal;
}

sup {
    top:-.5em;
}

sup {
    font-size : 75%;
    color:#80bfff;
    text-decoration:underline;
    line-height:0;
    position:relative;
    vertical-align:baseline;
}

.cntContent .cntContent__content ol a {
    font-weight : 600;
    color:#80bfff;
}

/* modal popup관련 css */

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* The Close Button */
/* .close { color: #fff; float: right; font-size: 28px; font-weight: bold;}
.close:hover,
.close:focus { color: black; text-decoration: none; cursor: pointer;} */

.modal-header { padding: 3rem 0 2rem;}
.modal-body { padding: 2rem;}
.modal-body > p { margin-bottom: 3rem;}
.modal-body > p:last-child { margin-bottom: 0;}
.modal-footer { display: flex; border-top: 1px solid #000;}
.modal-footer > button { flex: 1; padding: 1rem; border: none;}

/* Modal Content */
.modal-content { 
  position: relative;
  text-align: center;
  background-color: #fff;
  margin: auto;
  padding: 0;
  border: 1px solid #000000;
  width: 400px;
  top: 10rem;
  border-radius: 2rem 2rem 0 0;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  animation-name: animatetop;
  animation-duration: 0.4s
}
.modal-content.searchModal { width: 60%; margin: 0 auto;}
.modal-content.searchModal .modal-body { padding: 0 5rem 4rem;}
.modal-content.searchModal h3 { text-align: left;}
.modal-content.searchModal .search { position: relative; margin-bottom: 2rem;}
.modal-content.searchModal .search button { position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 3rem; height: 3rem; background: url(../../images/ic_search.png) no-repeat center / 50% auto;}
.modal-content.searchModal .basicList li { padding-top: .5rem; padding-bottom: .5rem; border-bottom: 1px solid #333;}
.modal-content.searchModal .basicList li .containerChk i { font-weight: 900;}

/* Add Animation */
@keyframes animatetop {
  from {top: -10rem; opacity: 0}
  to {top: 10rem; opacity: 1}
}