@charset "UTF-8";
.ico.arr_down {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_down.png");
  width: 15px;
  height: 15px;
}
.ico.arr_down2 {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_down4.png");
  width: 40px;
  height: 40px;
}
.ico.none {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_noResult.png");
  width: 62px;
  height: 62px;
}
.ico.plus {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_plus.png");
  width: 30px;
  height: 30px;
}
.ico.plus2 {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_plus2.png");
  width: 18px;
  height: 18px;
}
.ico.minus {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_minus.png");
  width: 30px;
  height: 30px;
}
.ico.call {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_call.png");
  width: 40px;
  height: 40px;
}
.ico.tel {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_call2.png");
  width: 20px;
  height: 20px;
}
.ico.form {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_form.png");
  width: 40px;
  height: 40px;
}
.ico.work {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_work.png");
  width: 40px;
  height: 40px;
}
.ico.bag {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_bag.png");
  width: 40px;
  height: 40px;
}
.ico.customer {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_customer.png");
  width: 40px;
  height: 40px;
}
.ico.document {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_document.png");
  width: 40px;
  height: 40px;
}
.ico.member {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_member.png");
  width: 40px;
  height: 40px;
}
.ico.nametag {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_nametag.png");
  width: 40px;
  height: 40px;
}
.ico.talk {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_talk.png");
  width: 40px;
  height: 40px;
}
.ico.test {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/icon/ico_test.png");
  width: 40px;
  height: 40px;
}

.pointA {
  color: #ED1C24;
}
.pointB {
  color: #6B6B6B;
}
.pointC {
  color: #fff;
}

.thumb {
  display: inline-block;
}
.thumb img {
  max-width: 100%;
  max-height: 100%;
}

.typeW {
  padding: 0 40px;
  padding-top: 87px;
  padding-bottom: 60px;
}

.typeS {
  padding: 0 15px;
  padding-top: 87px;
  padding-bottom: 60px;
}

.typeXS {
  padding: 0 12px;
  padding-top: 87px;
  padding-bottom: 60px;
}

#container {
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-size: 15px;
  line-height: 1;
  font-weight: 400;
}
#container .headArea {
  letter-spacing: -0.01em;
  margin-bottom: 40px;
}
#container .headArea.typeW {
  padding: 0 25px;
}
#container .headArea h2 {
  margin-bottom: 40px;
  font-weight: 400;
}
#container .headArea .location {
  color: #6B6B6B;
  font-size: 14px;
  font-weight: 300;
  margin-bottom: 10px;
  display: block;
}
#container h3 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.05em;
  display: block;
  margin-bottom: 30px;
  margin-top: 60px;
}
#container h3.lineRed {
  padding-bottom: 16px;
  border-bottom: 2px solid #ED1C24;
  margin-right: -40px;
  margin-top: 60px;
  line-height: 1.2em;
  position: relative;
}
#container h3.lineRed.typeShort {
  border-bottom: none;
  padding-left: 0;
}
#container h3.lineRed.typeShort:after {
  content: "";
  width: 60px;
  height: 2px;
  background: #ED1C24;
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
}
#container .title {
  display: block;
}
#container .title.right {
  text-align: right;
}
#container .title.lineRed {
  font-size: 36px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-weight: 400;
  margin-bottom: 38px;
}
#container .title.lineRed.on .bold {
  font-weight: 700;
}
#container .title.lineRed.on .effect:after {
  content: "";
  width: 100%;
}
#container .title.lineRed .bold {
  font-weight: 500;
  transition: all 0.3s;
}
#container .title.lineRed .effect {
  position: relative;
}
#container .title.lineRed .effect > span {
  position: relative;
  z-index: 10;
}
#container .title.lineRed .effect:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 6px;
  width: 0;
  height: 15px;
  background: #ED1C24;
  z-index: 5;
  transition: all 0.3s;
}

.listArea.typeA li {
  margin-top: 16px;
  padding-left: 14px;
  width: 100%;
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.05em;
  line-height: 1.5em;
  position: relative;
}
.listArea.typeA li:first-child {
  margin-top: 0;
}
.listArea.typeA li:before {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #000;
  margin-right: 10px;
  position: absolute;
  top: 8px;
  left: 0;
}
.listArea.typeA li strong {
  font-weight: 600;
}
.listArea.typeA.dot-red li:before {
  background: #ED1C24;
}
.listArea.typeB li {
  margin-top: 24px;
  width: 49%;
  display: inline-block;
  font-size: 16px;
}
.listArea.typeC {
  display: inline-flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-content: flex-start;
}
.listArea.typeC li {
  width: 43vw;
  height: calc(43vw + 65px);
  color: #000;
}
.listArea.typeC li .thumb {
  background: #F9F9F9;
  width: 43vw;
  height: 43vw;
  padding: 10px;
}
.listArea.typeC li .name {
  display: block;
  text-align: center;
  font-size: 16px;
  margin-top: 16px;
}
.listArea.typeC li a {
  color: inherit;
}

.textBox.typeA {
  border: 1px solid #C7C7C7;
  padding: 20px;
  border-radius: 20px 0 20px 0;
  background: #fff;
  color: #000;
}
.textBox.typeB {
  border: 1px solid #C5C5C5;
  padding: 18px 25px 0;
  border-radius: 0 10px 10px 10px;
  background: #fff;
  color: #000;
  position: relative;
  width: calc(100% - 10px);
  margin-left: auto;
}
.textBox.typeB > p {
  margin-bottom: 18px;
}
.textBox.typeB:before {
  content: "";
  position: absolute;
  top: -1px;
  left: -10px;
  background: url("/m/static/images/common/box_tail.png") no-repeat 100% calc(100% - 1px);
  background-size: 10px;
  width: 10px;
  height: 11px;
  border-top: 1px solid #C5C5C5;
}
.textBox.typeB .hiddenBox {
  border-radius: 0 0 10px 10px;
  background: #000;
  color: #fff;
  font-family: "Nanum", sans-serif;
  line-height: 1.3em;
  margin: 18px -25px 0 -36px;
  padding: 20px 37px;
  display: none;
}
.textBox.typeB .hiddenBox p {
  font-weight: 400 !important;
  word-break: break-all;
  line-height: 1.65em;
  opacity: 0;
  transition: opacity 0.3s 0.35s;
}
.textBox.typeB .hiddenBox.on p {
  opacity: 1;
}

.textArea.typeA p {
  font-size:9pt;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.005em;
  line-height: 1.5em;
}
.textArea.typeA p.sizeM {
  font-size: 18px;
}
.textArea.typeA .TextS {
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.02em;
}
.textArea.typeA .TextB {
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.5em;
  display: block;
  margin-bottom: 10px;
  font-size: 16px;
}
.textArea.typeB .title {
  font-size: 20px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  letter-spacing: -0.07em;
  line-height: 1.2em;
  margin-bottom: 16px;
  color: #000;
  font-weight: 700;
}
.textArea.typeB p {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.005em;
  line-height: 1.2em;
  margin-bottom: 10px;
  color: #666666;
}

.tab.typeA a {
  border: 1px solid #dddddd;
  border-radius: 8px;
  background: #fff;
  font-size: 16px;
  text-align: center;
  display: inline-block;
  padding: 7px 14px;
  margin-top: 6px;
  line-height: 1.5em;
}
.tab.typeA a.on {
  background: #000;
  color: #fff;
  font-weight: 600;
  border-color: #000;
}

input, select, textarea {
  border: 1px solid #dddddd;
  padding: 16px;
  font-size: 16px;
}
input::placeholder, select::placeholder, textarea::placeholder {
  color: #dddddd;
}

.inputArea {
  width: 100%;
  margin-bottom: 20px;
  font-family: "Nanum", sans-serif;
}
.inputArea label, .inputArea .label {
  display: block;
  font-size: 16px;
  letter-spacing: -0.05em;
  margin-bottom: 10px;
  font-family: inherit;
}
.inputArea label a, .inputArea .label a {
  border-bottom: 1px solid #ED1C24;
}
.inputArea label .important, .inputArea .label .important {
  color: #ED1C24;
  font-size: 16px;
  font-weight: 600;
  margin-left: 3px;
}
.inputArea input, .inputArea select, .inputArea textarea {
  display: block;
  width: 100%;
  font-family: inherit;
}
.inputArea select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url("/m/static/images/common/ico_arrow_down.png") no-repeat calc(100% - 20px) 50%;
  background-size: 15px;
}
.inputArea .fileArea {
  display: flex;
  justify-content: space-between;
}
.inputArea .fileArea input[type=file] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 70%;
  margin-right: 10px;
}
.inputArea .fileArea input[type=file]::-webkit-file-upload-button {
  display: none;
}
.inputArea .fileArea input[type=file] + label {
  background: #000;
  color: #fff;
  font-size: 16px;
  padding: 19px 22px;
  width: 31%;
  min-width: 100px;
  text-align: center;
  margin-bottom: 0;
}
.inputArea .info {
  color: #888888;
  font-size: 14px;
  margin-top: 10px;
  line-height: 1.2em;
  display: block;
}

.chkboxArea {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 12px;
}
.chkboxArea label {
  margin-left: 12px;
  margin-bottom: 0;
}
.chkboxArea label .important {
  vertical-align: auto;
}
.chkboxArea input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
  background: #fff;
  padding: 0;
  display: inline-block;
}
.chkboxArea input[type=checkbox]:checked {
  background: #ED1C24 url("/m/static/images/common/ico_check.png") no-repeat center center;
  background-size: 10px;
  border-color: #ED1C24;
}

.btnTypeA {
  background: #000;
  color: #fff;
  text-align: center;
  display: block;
  font-family: "Nanum", sans-serif;
}
.btnTypeA.sizeFull {
  font-size: 18px;
  padding: 28px 0;
  width: 100%;
  color: #fff;
}
.btnTypeA.sizeM {
  font-size: 18px;
  padding: 17px 0;
  width: calc(100% - 55px);
  color: #fff;
  margin: 0 auto;
}
.btnTypeA.sizeS {
  font-size: 18px;
  padding: 19px 22px;
  width: 32%;
  min-width: 100px;
  color: #fff;
  margin: 0 auto;
}
.btnBack {
  width: 40px;
  height: 40px;
  padding: 0;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.btnSearch {
  width: 40px;
  height: 40px;
  padding: 0;
}
.btnMore {
  width: 68px;
  height: calc(68px + 15px);
  background: url("/m/static/images/common/btn_more.png") no-repeat top center;
  background-size: 68px;
  position: relative;
  display: block;
  margin: 0 auto;
}
.btnMore > span {
  color: #666666;
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);
  font-size: 16px;
  text-align: center;
  font-family: "Nanum", sans-serif;
}

.tableArea {
  margin-bottom: 18px;
}
.tableArea.typeA {
  margin-top: 14px;
}
.tableArea.typeA table {
  border-top: 2px solid #888888;
}
.tableArea.typeA table tr th {
  background: #f5f5f5;
  font-size: 14px;
  padding: 17px;
  text-align: center;
  border-bottom: 1px solid #dddddd;
  line-height: 1.6em;
  font-weight: 500;
}
.tableArea.typeA table tr td {
  background: #fff;
  font-size: 14px;
  color: #666666;
  padding: 18px 15px;
  border-bottom: 1px solid #dddddd;
  line-height: 1.4em;
}
.tableArea.typeA.line_l table {
  border-top-color: #BBB;
}

.popArea {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10001;
  background: #fff;
  overflow-y: auto;
}
.popArea .contArea {
  padding: 0 20px;
}
.popArea.typeA {
  padding-bottom: 224px;
}
.popArea.typeA .headArea {
  position: relative;
  height: 60px;
}
.popArea.typeA .headArea .btnClose {
  position: fixed;
  top: 15px;
  right: 13px;
  width: 30px;
  height: 30px;
  background: url("/m/static/images/common/ico_close.png") no-repeat center;
  background-size: 30px;
  z-index: 100;
}
.popArea.typeA p {
  word-break: break-all;
}
.popArea.typeA .topArea {
  padding: 0 20px;
  margin-bottom: 40px;
}
.popArea.typeA .topArea .title {
  font-size: 24px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
}
.popArea.typeA .contArea .bigDesc {
  font-size: 30px;
  letter-spacing: -0.01em;
  line-height: 1.3em;
  margin-bottom: 24px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-weight: 500;
  display: block;
}
.popArea.typeA .contArea .infoList li {
  margin-top: 60px;
}
.popArea.typeA .contArea .infoList li > .title {
  display: inline-block;
  font-size: 24px;
  color: #ED1C24;
  margin-bottom: 24px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-weight: 700;
  letter-spacing: -0.025em;
}
.popArea.typeA .contArea .infoList li .tableArea {
  margin: 40px 0;
}
.popArea.typeA .contArea .infoList li .tableArea table {
  width: 100%;
  font-family: "Nanum", sans-serif;
}
.popArea.typeA .contArea .infoList li .tableArea table th {
  line-height: 1.4em;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaB {
  text-align: center;
  margin: 40px 0 0;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaB th, .popArea.typeA .contArea .infoList li .tableArea.tableAreaB td {
  border-left: 1px solid #ddd;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaB th:first-child, .popArea.typeA .contArea .infoList li .tableArea.tableAreaB td:first-child {
  border-left: none;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaC {
  position: relative;
  overflow-x: scroll;
  padding-bottom: 18px;
  margin: 40px 0;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaC::-webkit-scrollbar {
  height: 2px;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaC::-webkit-scrollbar-track {
  background-color: #eee;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaC::-webkit-scrollbar-thumb {
  background-color: #000;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaC::-webkit-scrollbar-button {
  width: 0;
  height: 0;
}
.popArea.typeA .contArea .infoList li .tableArea.tableAreaC table {
  min-width: 550px;
}
.popArea.typeA .contArea .infoList li .dot {
  margin: 20px 0;
}
.popArea.typeA .contArea .infoList li .dot li {
  position: relative;
  padding-left: 15px;
  margin-top: 7px;
  font-family: "Nanum", sans-serif;
  line-height: 1.5em;
}
.popArea.typeA .contArea .infoList li .dot li:before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #000;
  position: absolute;
  left: 5px;
  top: 8px;
}
.popArea.typeA .contArea .infoList li .dot.dotA {
  margin: 0;
}
.popArea.typeA .contArea .infoList li .dot.dotA li {
  color: #666;
}
.popArea.typeA .contArea .infoList li .dot.dotA li:before {
  background: #666;
}
.popArea.typeA .contArea .infoList li .beforePolicyList li {
  border-bottom: 1px solid #ddd;
  padding: 24px 0 14px;
  margin-top: 0;
}
.popArea.typeA .contArea .infoList li .beforePolicyList li a strong {
  position: relative;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.3px;
}
.popArea.typeA .contArea .infoList li .beforePolicyList li a strong:after {
  content: "";
  position: absolute;
  right: -12px;
  top: 7px;
  width: 7px;
  height: 7px;
  border-top: 1px solid #111;
  border-right: 1px solid #111;
  transform: rotate(45deg);
}
.popArea.typeA .contArea .infoList li .beforePolicyList li a p {
  margin: 5px 0 0;
  font-size: 14px;
  color: #666;
}
.popArea.typeA .contArea .infoList .typeB {
  margin-top: 40px;
}
.popArea.typeA .contArea .infoList .typeB.typeB-1 p {
  color: #000;
}
.popArea.typeA .contArea .infoList .typeB.typeB-1 .dot.dotA {
  margin: 30px 0;
}
.popArea.typeA .contArea .infoList .typeB .title {
  display: inline-block;
}
.popArea.typeA .contArea .infoList .typeB p {
  line-height: 1.5em;
}
.popArea.typeA .contArea .infoList .typeC p {
  margin-top: 16px;
  color: #888;
  font-size: 15px;
  font-family: "Nanum", sans-serif;
  line-height: 1.4em;
}
.popArea .storyPopCont .topArea em {
  font-size: 18px;
  color: #ED1C24;
  letter-spacing: -0.025em;
  line-height: 1.5em;
  display: block;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
}
.popArea .storyPopCont .topArea .title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.025em;
  display: block;
}

.pagination {
  display: inline-flex;
  font-family: "Nanum", sans-serif;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 10;
  width: 100%;
}
.pagination a.off {
  opacity: 0.2;
}
.pagination a.next {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_next1.png");
  width: 20px;
  height: 20px;
}
.pagination a.prev {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_prev1.png");
  width: 20px;
  height: 20px;
}
.pagination .pageNumber {
  margin: 3px 30px 0;
}
.pagination .pageNumber span {
  color: #CCCCCC;
}
.pagination .pageNumber span.current {
  color: #000;
}
.pagination ul {
  display: inline-flex;
  font-family: "Nanum", sans-serif;
  align-items: center;
}
.pagination ul li {
  color: #000;
  padding: 0 10px;
  box-sizing: content-box;
}
.pagination ul li a {
  color: #CCCCCC;
}
.pagination ul li.next {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_next1.png");
  width: 20px;
  height: 20px;
  background-size: contain;
}
.pagination ul li.next img {
  display: none;
}
.pagination ul li.prev {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_prev1.png");
  width: 20px;
  height: 20px;
  background-size: contain;
}
.pagination ul li.prev img {
  display: none;
}

.none + .pagination {
  display: none;
}

.pageControl a {
  font-size: 16px;
  letter-spacing: -0.025em;
  font-family: "Nanum", sans-serif;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.pageControl a em {
  color: #000;
  margin-left: 10px;
}
.pageControl a .title {
  color: #888888;
  margin-left: 20px;
}
.pageControl a .prev {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_up3.png");
  width: 30px;
  height: 30px;
}
.pageControl a .next {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/ico_arrow_down3.png");
  width: 30px;
  height: 30px;
}

.headArea .mainText, .topArea .mainText {
  display: block;
  font-size: 8.75vw;
  margin-bottom: 38px;
  line-height: 1.25em;
  position: relative;
  white-space: nowrap;
  letter-spacing: -0.05em;
  font-weight: 500;
}
.headArea .mainText strong, .topArea .mainText strong {
  font-weight: 700;
}
.headArea .mainText.sizeM, .topArea .mainText.sizeM {
  font-size: 36px;
  font-weight: 400;
}
.headArea .subText, .topArea .subText {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  line-height: 1.6em;
  letter-spacing: -0.025em;
  display: block;
  margin-left: auto;
}

.visual.motion {
  height: 480px;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 110%;
  padding: 27px 40px 0;
  margin: -27px -40px 0;
  overflow: hidden;
  z-index: 100;
}
.visual.motion.topFix {
  height: 197px !important;
  position: absolute;
  top: 370px;
  width: 100%;
  left: 40px;
}
.visual.motion .headArea {
  color: #fff;
  transition: all 0.5s;
  width: 100%;
  pointer-events: none;
  position: fixed;
  top: 87px;
  left: 40px;
}
.visual.motion .headArea.topFix {
  position: absolute;
  top: 87px;
  animation: delayMove 0.6s forwards;
}
@keyframes delayMove {
  0% {
    top: 87px;
  }
  100% {
    top: 107px;
  }
}
.visual.motion .headArea .location {
  color: #eee;
}
.visual.motion .mainText {
  font-size: 8.75vw;
  margin-bottom: 38px;
  line-height: 1.25em;
  position: relative;
  white-space: nowrap;
  letter-spacing: -0.05em;
  color: #fff;
  transition: all 0.5s;
  opacity: 1;
}
.visual.motion .mainText.hide {
  opacity: 0;
}

.search {
  position: relative;
  z-index: 1;
}
.search input[type=text] {
  border: 1px solid #dddddd;
  background: #fff;
  padding: 10px 40px 10px 16px;
  color: #000;
  font-size: 16px;
  display: block;
  width: 100%;
  font-family: "Nanum", sans-serif;
}
.search .btnSearch {
  position: absolute;
  top: 0;
  right: 0;
}

#gnbProduct {
  line-height: 1;
  font-family: "Nanum", sans-serif;
}
#gnbProduct .popArea {
  left: 100vw;
  transition: all 0.3s;
}
#gnbProduct .popArea.on {
  left: 0;
}
#gnbProduct .headArea {
  width: 100%;
  height: 60px;
  background: #fff;
  position: relative;
  border-bottom: 1px solid #dddddd;
}
#gnbProduct .topArea {
  padding: 30px 20px;
}
#gnbProduct .contArea {
  height: calc(100% - 160px);
  overflow-y: auto;
  padding-bottom: 20px;
}
#gnbProduct .contArea h2 {
  font-size: 24px;
  font-weight: 600;
  padding-bottom: 10px;
  border-bottom: 1px solid #000;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
}
#gnbProduct .contArea .listArea .title {
  font-weight: 600;
  font-size: 18px;
  color: #e70012;
  margin-top: 24px;
  font-family: "Nanum", sans-serif;
  display: block;
}
#gnbProduct .contArea .listArea .title.line {
  border-bottom: 1px solid #dddddd;
  padding-bottom: 24px;
}
#gnbProduct .contArea .listArea .title a {
  font-family: inherit;
}
#gnbProduct .contArea .listArea .title a.eng {
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
}
#gnbProduct .contArea .listArea.typeB .productList {
  border-bottom: 1px solid #dddddd;
  padding-bottom: 24px;
}
#gnbProduct .contArea .listArea.typeB .productList li {
  vertical-align: top;
}
#gnbProduct .contArea .listArea.typeB .productList:last-child {
  border-bottom: none;
}
#gnbProduct .searchResult .searchWord {
  color: #ED1C24;
  font-weight: 600;
}
#gnbProduct .searchResult .none {
  padding: 12px 0;
  text-align: center;
}
#gnbProduct .searchResult .none .ico {
  display: block;
  margin: 0 auto;
}
#gnbProduct .searchResult .none p {
  font-size: 16px;
  margin-top: 14px;
}

#container.PLP {
  background: #F9F9F9;
  padding-top: 60px;
}
#container.PLP .topArea {
  position: relative;
  height: 400px;
  font-family: "Nanum", sans-serif;
  padding: 40px 20px 0;
  opacity: 0;
  transition: all 0.6s 0.1s;
}
#container.PLP .topArea:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  border-left: 100vw solid #F9F9F9;
  border-top: 0 solid transparent;
  border-bottom: 360px solid #F9F9F9;
  transition: all 0.7s cubic-bezier(0, 0.55, 0.45, 1);
}
#container.PLP .topArea .textWrap {
  color: #fff;
}
#container.PLP .topArea h2 {
  font-size: 45px;
  font-weight: 700;
  margin-bottom: 17px;
  margin-left: -100px;
  opacity: 0;
  transition: all 0.6s 0.15s cubic-bezier(0, 0.55, 0.45, 1);
}
#container.PLP .topArea .desc {
  font-size: 24px;
  line-height: 1.4em;
  margin-left: -100px;
  opacity: 0;
  transition: all 0.6s 0.25s cubic-bezier(0, 0.55, 0.45, 1);
}
#container.PLP .topArea .imgWrap {
  position: absolute;
  right: 0;
  bottom: 20px;
  width: 205px;
  z-index: 10;
  opacity: 0;
  transition: all 0.6s 0.25s cubic-bezier(0, 0.55, 0.45, 1);
}
#container.PLP .topArea.on {
  opacity: 1;
}
#container.PLP .topArea.on:after {
  border-top: 60px solid transparent;
  border-bottom: 2px solid #F9F9F9;
}
#container.PLP .topArea.on h2 {
  margin-left: 0;
  opacity: 1;
}
#container.PLP .topArea.on .desc {
  margin-left: 0;
  opacity: 1;
}
#container.PLP .topArea.on .imgWrap {
  bottom: -20px;
  opacity: 1;
}
#container.PLP .topArea.new {
  background-image: radial-gradient(circle at 71% 48%, #9a43ef, #6410b7 52%);
}
#container.PLP .topArea.sparkle {
  background-image: radial-gradient(circle at 71% 48%, #ff4d5b, #d50011 52%);
}
#container.PLP .topArea.juice {
  background-image: radial-gradient(circle at 71% 48%, #fb9467, #ff6d10 52%);
}
#container.PLP .topArea.sports {
  background-image: radial-gradient(circle at 71% 48%, #3eacde, #0077bc 52%);
}
#container.PLP .topArea.energy {
  background-image: radial-gradient(circle at 71% 48%, #464646, #000000 52%);
}
#container.PLP .topArea.ion {
  background-image: radial-gradient(circle at 71% 48%, #7bccf6, #03aff6 52%);
}
#container.PLP .topArea.life {
  background-image: radial-gradient(circle at 71% 48%, #d9597c, #df0b4b 52%);
}
#container.PLP .topArea.tea {
  background-image: radial-gradient(circle at 71% 48%, #916131, #6d3600 52%);
}
#container.PLP .topArea.water {
  background-image: radial-gradient(circle at 71% 48%, #923b87, #6a0c5b 52%);
}
#container.PLP .productList {
  padding-top: 40px;
}
#container.PLP .productList .productArea {
  margin-bottom: 70px;
  position: relative;
}
#container.PLP .productList .productArea .productCard {
  position: absolute;
  z-index: 10;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  padding: 30px 25px 42px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  width: calc(100% - 40px);
  border-radius: 30px 0 30px 0;
  background: #fff;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.16);
}
#container.PLP .productList .productArea .productCard .name {
  font-size: 35px;
  font-weight: 700;
  margin-bottom: 18px;
}
#container.PLP .productList .productArea .productCard .desc {
  font-size: 18px;
  color: #6B6B6B;
  margin-bottom: 40px;
}
#container.PLP .productList .productArea .productCard .thumb {
  width: 100%;
  min-height: 270px;
}
#container.PLP .productList .productArea .productCard::after {
  content: "";
  position: absolute;
  top: 16px;
  right: -6px;
  width: 45px;
  height: 1px;
  transform: rotate(-45deg);
  background: #000;
}
#container.PLP .productList .colorBgBox {
  height: 328px;
  width: 200vw;
  margin-left: -50vw;
  position: absolute;
}

.headerFix .category {
  top: 0 !important;
}

#container.PDP .topArea {
  padding-top: 50px;
}
#container.PDP .topArea .category {
  position: fixed;
  top: 60px;
  left: 0;
  width: 100%;
  background: #fff;
  transition: all 0.2s;
  z-index: 100;
}
#container.PDP .topArea .category .selected {
  border-bottom: 1px solid #dddddd;
  position: relative;
}
#container.PDP .topArea .category .selected a {
  width: 100%;
  height: 100%;
  display: block;
  padding: 15px 20px;
  text-align: center;
}
#container.PDP .topArea .category .selected .arr_down {
  position: absolute;
  top: calc(50%);
  right: 20px;
  transform: translateY(-50%);
  transition: all 0.3s;
}
#container.PDP .topArea .category .selected.on .arr_down {
  position: absolute;
  top: calc(50%);
  right: 20px;
  transform: translateY(-50%) rotate(180deg);
}
#container.PDP .topArea .category .selectList {
  background: #fff;
  padding: 12px 20px;
  display: none;
}
#container.PDP .topArea .category .selectList li a {
  padding: 12px 0;
  text-align: center;
  width: 100%;
  height: 100%;
  display: block;
}
#container.PDP .topArea .category + .dim {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  z-index: 99;
  display: none;
}
#container.PDP .productDetail .productName {
  font-size: 36px;
  color: #ED1C24;
  display: block;
  text-align: center;
  font-weight: 700;
  line-height: 1.3em;
  margin-bottom: 4px;
}
#container.PDP .productDetail .desc {
  font-size: 18px;
  font-family: "Nanum", sans-serif, sans-serif;
  letter-spacing: -0.025em;
  line-height: 1.3em;
  text-align: center;
  font-weight: bold;
}
#container.PDP .productDetail .thumb {
  width: 100%;
  max-height: 390px;
  text-align: center;
  margin-bottom: 24px;
}
#container.PDP .productDetail .textArea em {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  font-weight: 600;
  text-align: center;
  letter-spacing: -0.025em;
  line-height: 1.2em;
  display: block;
  margin-bottom: 8px;
}
#container.PDP .productDetail .textArea p {
  text-align: center;
}
#container.PDP .productDetail .info {
  padding: 40px 0;
  margin-top: 40px;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}
#container.PDP .productDetail .info li {
  display: flex;
  margin-bottom: 14px;
  line-height: 1.4em;
}
#container.PDP .productDetail .info li:last-child {
  margin-bottom: 0;
}
#container.PDP .productDetail .info li .title {
  font-size: 14px;
  font-family: "Nanum", sans-serif;
  color: #ED1C24;
  width: 62px;
  margin-right: 20px;
  font-weight: 600;
  flex-shrink: 0;
}
#container.PDP .productDetail .info li .title:before {
  content: "·";
  display: inline-block;
  margin-right: 4px;
}
#container.PDP .productDetail .info li .textWrap {
  font-size: 14px;
}
#container.PDP .productDetail .info li .textWrap em {
  font-weight: 600;
  display: block;
  margin-bottom: 8px;
}
#container.PDP .productDetail .info li .textWrap p {
  margin-bottom: 10px;
}
#container.PDP .productDetail .info li .textWrap p:last-child {
  margin-bottom: 0;
}
#container.PDP .productList.typeThumbList {
  margin-top: 40px;
}
#container.PDP .productList.typeSlide {
  margin-top: 60px;
}
#container.PDP .productList.typeSlide .title {
  text-align: center;
}
#container.PDP .productList.typeSlide .subTitle {
  font-size: 18px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.025em;
  display: block;
  margin-top: 16px;
}
#container.PDP .productList.typeSlide .slideArea {
  position: relative;
  padding-bottom: 46px;
}
#container.PDP .productList.typeSlide .slideArea #bestAndNew .swiper-wrapper .swiper-slide .thumb {
  background: #f9f9f9;
  padding: 10px;
}
#container.PDP .productList.typeSlide .slideArea #bestAndNew .swiper-wrapper .swiper-slide .name {
  display: block;
  text-align: center;
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  font-weight: 400;
  margin-top: 16px;
}
#container.PDP .productList.typeSlide .slideArea #bestAndNew .swiper-pagination .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  background: #dddddd;
  opacity: 1;
}
#container.PDP .productList.typeSlide .slideArea #bestAndNew .swiper-pagination .swiper-pagination-bullet-active {
  background: #ED1C24;
}

#container.main {
  padding-top: 60px;
}
#container.main .topArea {
  width: 100%;
  height: calc(100vh - 60px);
}
#container.main .topArea #visual {
  height: calc(100vh - 360px);
  width: 100%;
  overflow: hidden;
  transition: height 0.6s 0.3s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.5s 0.2s ease-in-out;
  opacity: 0;
}
#container.main .topArea #visual.on {
  height: calc(100vh - 60px);
  opacity: 1;
}
#container.main .topArea #visual .swiper {
  height: 100%;
}
#container.main .topArea #visual .swiper .swiper-wrapper {
  height: 100%;
}
#container.main .topArea #visual .swiper .swiper-wrapper .swiper-slide {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
  height: 80vh !important;
  padding: 38px 23px;
}
#container.main .topArea #visual .swiper .swiper-wrapper .swiper-slide .mainText {
  color: #fff;
  font-family: "Nanum", sans-serif;
  font-weight: 700;
  font-size: 35px;
  line-height: 1.3em;
  display: block;
  margin-bottom: 16px;
}
#container.main .topArea #visual .swiper .swiper-wrapper .swiper-slide .subText {
  color: #fff;
  font-family: "Nanum", sans-serif;
  font-size: 20px;
  line-height: 1.5em;
  display: block;
  margin-bottom: 20px;
}
#container.main .topArea #visual .swiper .swiper-wrapper .swiper-slide .visualImg {
  position: absolute;
  right: 6%;
  bottom: -11%;
  width: auto;
  height: 80%;
}
#container.main .topArea #visual .swiper .swiper-wrapper .swiper-slide .visualImg.power {
  right: -3%;
}
#container.main .topArea #visual .swiper .swiper-wrapper .swiper-slide .visualImg.monster {
  right: 0;
  height: 75%;
}
#container.main .topArea #visual .controlArea {
  position: absolute;
  top: 57vw;
  left: 23px;
  z-index: 10;
  width: 130px;
}
#container.main .topArea #visual .controlArea progress {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  height: 2px;
  width: 108px;
}
#container.main .topArea #visual .controlArea progress::-webkit-progress-bar {
  background: rgba(255, 255, 255, 0.6);
}
#container.main .topArea #visual .controlArea progress::-webkit-progress-value {
  background: white;
}
#container.main .topArea #visual .controlArea .control {
  width: 15px;
  height: 15px;
  display: block;
  position: absolute;
  top: 7px;
  right: 0;
  padding: 0;
}
#container.main .topArea #visual .controlArea .control .stop {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
#container.main .topArea #visual .controlArea .control .stop .line {
  width: 2px;
  height: 15px;
  background: #fff;
  position: absolute;
}
#container.main .topArea #visual .controlArea .control .stop .line:nth-of-type(1) {
  top: 0;
  left: 3px;
}
#container.main .topArea #visual .controlArea .control .stop .line:nth-of-type(2) {
  top: 0;
  right: 3px;
}
#container.main .topArea #visual .controlArea .control .play {
  position: relative;
  display: none;
  width: 100%;
  height: 100%;
  border-top: 8px solid transparent;
  border-left: 14px solid #fff;
  border-bottom: 8px solid transparent;
}
#container.main .contArea {
  padding-top: 0;
}
#container.main .contArea section > .title {
  font-size: 36px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-weight: 400;
}
#container.main .contArea section > .title .subText {
  font-size: 24px;
  margin-right: 13px;
  color: #888;
  text-align: right;
  font-family: "LG_Smart_Light", Tahoma, Arial, sans-serif;
  display: block;
}
#container.main .contArea section > .title .bold {
  font-weight: 700;
}
#container.main .contArea section > .title .effect {
  position: relative;
}
#container.main .contArea section > .title .effect > span {
  position: relative;
  z-index: 10;
}
#container.main .contArea section > .title .effect:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 0;
  height: 15px;
  background: #ED1C24;
  z-index: 5;
  transition: width 0.3s;
}
#container.main .contArea section > .title .effect.on:after {
  width: 100%;
}
#container.main .contArea .section1 {
  margin-bottom: 41px;
}
#container.main .contArea .section2 {
  margin-bottom: 67px;
}
#container.main .contArea .section2 .productArea {
  margin-top: 43px;
}
#container.main .contArea .section2 .productArea ul {
  margin-bottom: 56px;
}
#container.main .contArea .section2 .productArea ul li {
  position: relative;
  height: 300px;
  padding-top: 30px;
}
#container.main .contArea .section2 .productArea ul li .wrap {
  position: absolute;
  top: 0;
  display: flex;
  align-items: center;
}
#container.main .contArea .section2 .productArea ul li .wrap.left {
  left: 0;
}
#container.main .contArea .section2 .productArea ul li .wrap.right {
  right: 0;
  flex-flow: row-reverse;
}
#container.main .contArea .section2 .productArea ul li .wrap.right + .bg {
  margin-left: auto;
  margin-right: -76px;
}
#container.main .contArea .section2 .productArea ul li .thumb {
  max-width: 148px;
  height: 300px;
  display: flex;
  align-items: flex-end;
  padding: 0 30px;
  box-sizing: content-box;
}
#container.main .contArea .section2 .productArea ul li .textArea {
  margin: 73px 10px 0;
  opacity: 0;
  transform: translateX(50px);
  transition: all 0.3s;
}
#container.main .contArea .section2 .productArea ul li .textArea.on {
  opacity: 1;
  transform: translateX(0);
}
#container.main .contArea .section2 .productArea ul li .textArea .name {
  font-size: 24px;
  font-family: "Nanum", sans-serif;
  display: block;
  margin-bottom: 10px;
  line-height: 1.3em;
}
#container.main .contArea .section2 .productArea ul li .textArea .name .bold {
  font-weight: 700;
}
#container.main .contArea .section2 .productArea ul li .bg {
  background: #f5f5f5;
  border-radius: 50%;
  width: 300px;
  height: 300px;
  display: block;
  margin-left: -76px;
}
#container.main .bottomArea .csArea dl {
  color: #fff;
  background-color: #B9B7B0;
  padding: 33px 20px;
  margin-top: 2px;
  background-repeat: no-repeat;
  background-position-y: center;
}
#container.main .bottomArea .csArea dl.red {
  background-color: #d50011;
}
#container.main .bottomArea .csArea dl dt {
  font-size: 24px;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-weight: 600;
  margin-bottom: 9px;
}
#container.main .bottomArea .csArea dl dd {
  font-size: 16px;
  line-height: 1.3em;
  font-family: "Nanum", sans-serif;
}
#container.main .bottomArea .csArea dl.right {
  text-align: right;
}
#container.main .bottomArea .csArea dl a:nth-of-type(1) {
  margin-top: 0;
}
#container.main .bottomArea .csArea dl.faq {
  background-image: url("/m/static/images/main/bg_faq.png");
  background-size: 122px;
  background-position-x: 30px;
}
#container.main .bottomArea .csArea dl.voice {
  background-image: url("/m/static/images/main/bg_customer.png");
  background-size: 106px;
  background-position-x: calc(100% - 40px);
  background-position-y: bottom;
}
#container.main .bottomArea .csArea dl.call {
  background-image: url("/m/static/images/main/bg_call.png");
  background-size: 121px;
  background-position-x: 20px;
  background-position-y: bottom;
}
#container.main .slideArea.gallery {
  margin-top: 56px;
}
#container.main .slideArea.gallery .swiper {
  width: 100vw;
  margin: 0 -12px;
}
#container.main .slideArea.gallery .swiper .swiper-wrapper .swiper-slide {
  width: calc(100% - 70px) !important;
  transform: translateX(35px);
}
#container.main .slideArea.gallery .swiper .swiper-wrapper .swiper-slide .title {
  text-align: center;
  margin-top: 20px;
  padding-bottom: 44px;
  font-family: "Nanum", sans-serif;
  font-weight: 600;
  font-size: 16px;
}
#container.main .slideArea.gallery .swiper .swiper-wrapper .swiper-slide .img {
  transition: all 0.3s;
  width: 100%;
  margin-left: 0;
  text-align: center;
}
#container.main .slideArea.gallery .swiper .swiper-wrapper .swiper-slide:not(.swiper-slide-active) .img {
  width: calc(100% - 70px);
  margin-top: 20px;
}
#container.main .slideArea.gallery .swiper .swiper-wrapper .swiper-slide .swiper-slide-active {
  transform: translateX(-320px);
}
#container.main .slideArea.gallery .swiper .swiper-wrapper .swiper-slide.swiper-slide-prev .img {
  margin-left: auto;
}
#container.main .slideArea.gallery .swiper .swiper-pagination {
  bottom: 0;
  font-size: 18px;
  font-family: "Nanum", sans-serif;
  font-weight: 600;
  color: #9D9D9D;
  letter-spacing: -0.1em;
}
#container.main .slideArea.gallery .swiper .swiper-pagination .swiper-pagination-current {
  color: #000;
}
#container.main .slideArea.gallery .swiper .swiper-button-next, #container.main .slideArea.gallery .swiper .swiper-button-prev {
  top: unset;
  bottom: 0;
  height: auto;
}
#container.main .slideArea.gallery .swiper .swiper-button-prev, #container.main .slideArea.gallery .swiper .swiper-rtl .swiper-button-next {
  left: calc(50% - 50px);
}
#container.main .slideArea.gallery .swiper .swiper-button-next, #container.main .slideArea.gallery .swiper .swiper-rtl .swiper-button-prev {
  right: calc(50% - 50px);
}
#container.main .slideArea.gallery .swiper .swiper-button-next:after, #container.main .slideArea.gallery .swiper .swiper-rtl .swiper-button-prev:after {
  content: "";
  background: url("/m/static/images/common/ico_arrow_next0.png") no-repeat center;
  background-size: 8px;
  width: 8px;
  height: 19px;
}
#container.main .slideArea.gallery .swiper .swiper-button-prev:after, #container.main .slideArea.gallery .swiper .swiper-rtl .swiper-button-next:after {
  content: "";
  background: url("/m/static/images/common/ico_arrow_prev0.png") no-repeat center;
  background-size: 8px;
  width: 8px;
  height: 19px;
}

#container.brand .topArea {
  height: calc(100vh - 60px);
  background: url("/m/static/images/brand/img_top.png") no-repeat top center;
  margin: 60px -40px 0;
  background-size: 130%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  transition: all 0.8s 0.1s cubic-bezier(0, 0.55, 0.45, 1);
}
#container.brand .topArea .brandText {
  padding: 40px;
  color: #fff;
}
#container.brand .topArea .brandText strong {
  font-size: 60px;
  font-family: "Nanum", sans-serif;
  display: block;
  margin-bottom: 37px;
  height: 62px;
  padding-top: 60px;
  overflow: hidden;
  transition: all 0.6s 0.5s cubic-bezier(0, 0.55, 0.45, 1);
  opacity: 0;
}
#container.brand .topArea .brandText strong.move.play {
  position: fixed;
  opacity: 1;
  padding-top: 0;
  top: 50%;
  transform: translateY(-50%) scale(1.5);
}
#container.brand .topArea .brandText span {
  font-size: 16px;
  display: block;
  margin-bottom: 37px;
  height: 20px;
  padding-top: 20px;
  overflow: hidden;
  transition: all 1s 0.5s cubic-bezier(0.83, 0, 0.17, 1);
  opacity: 0;
}
#container.brand .topArea .ico.arr_down2 {
  position: absolute;
  bottom: 180px;
  opacity: 0;
  left: 50%;
  transform: translateX(-50%);
  transition: all 2s 0.3s cubic-bezier(0.83, 0, 0.17, 1);
}
@keyframes arrMov {
  0% {
    bottom: 87px;
  }
  60% {
    bottom: 100px;
  }
  0% {
    bottom: 87px;
  }
}
#container.brand .topArea.on {
  background-size: 100%;
}
#container.brand .topArea.on .brandText strong {
  padding-top: 0;
  opacity: 1;
}
#container.brand .topArea.on .brandText span {
  padding-top: 0;
  opacity: 1;
}
#container.brand .topArea.on .ico.arr_down2 {
  bottom: 87px;
  opacity: 1;
  animation-delay: 2s;
}
#container.brand section {
  padding-top: 60px;
}
#container.brand section p strong {
  font-weight: 600;
}
#container.brand section.typeBlack {
  background: #000;
}
#container.brand section.typeBlack p {
  color: #ccc;
}
#container.brand section.typeGray {
  background: #f5f5f5;
}
#container.brand section.typeGray .mainText {
  color: #000;
}
#container.brand section.typeGray p {
  color: #666;
}
#container.brand section.typeGray p strong {
  color: #000;
}
#container.brand section .mainText {
  display: block;
  font-size: 36px;
  margin-bottom: 38px;
  line-height: 1.25em;
  position: relative;
  white-space: nowrap;
  letter-spacing: -0.05em;
  font-weight: 700;
}
#container.brand .section1 {
  margin-bottom: -150px;
}
#container.brand .section2 {
  padding-top: 219px;
}
#container.brand .section2 .mainText {
  color: #888;
  margin-top: 40px;
}
#container.brand .section3 .mainText {
  position: relative;
}
#container.brand .section3 .mainText .ico.bottle {
  display: inline-block;
  background: center no-repeat;
  background-size: 100%;
  background-image: url("/m/static/images/common/img_cola_none.png");
  width: 70px;
  height: 174px;
  position: absolute;
  top: -130px;
  left: 233px;
}
#container.brand .section4 .contWrap {
  padding-top: 0;
  padding-bottom: 0;
}
#container.brand .guideListArea ul li {
  position: relative;
  padding-bottom: 42px;
  padding-top: 60px;
}
#container.brand .guideListArea ul li .titleArea .desc {
  font-size: 14px;
  color: #888;
  display: block;
  margin-bottom: 15px;
}
#container.brand .guideListArea ul li .titleArea .title {
  margin-bottom: 40px;
}
#container.brand .guideListArea ul li.typeRed {
  color: #fff;
  margin-top: 78px;
  padding-top: 0;
  padding-bottom: 0;
  background: #ED1C24;
}
#container.brand .guideListArea ul li.typeRed .titleArea .desc {
  color: #fff;
}
#container.brand .guideListArea ul li.typeRed .imgArea {
  margin: 30px 0;
  width: 100%;
  height: 206px;
  text-align: center;
}
#container.brand .guideListArea ul li .topBg {
  position: absolute;
  top: -84px;
  left: 0;
  z-index: -1;
}
#container.brand .guideListArea ul li .bottomBg {
  position: absolute;
  bottom: -75px;
  right: 0;
  z-index: -1;
}
#container.brand .guideListArea ul li:nth-of-type(3) {
  padding-bottom: 0;
  margin-top: 50px;
}
#container.brand .guideListArea ul li:nth-of-type(3) .mainText {
  color: #888;
}
#container.brand .guideListArea ul li:nth-of-type(3) .imgArea {
  margin-bottom: 40px;
}
#container.brand .guideListArea ul li:nth-of-type(3) .imgArea .desc {
  font-size: 16px;
  line-height: 1.5em;
  color: #888;
  width: 284px;
  margin-left: auto;
  margin-top: 20px;
}
#container.brand .guideListArea ul li:nth-of-type(3) .imgArea .desc strong {
  color: #000;
}
#container.brand .guideListArea ul li:nth-of-type(3) .textArea .mainText {
  font-size: 24px;
  color: #888;
  margin-top: 40px;
  margin-bottom: 0;
}
#container.brand #img1 {
  width: calc(100vw - 40px);
  transform: translate(20px, 150px);
}
#container.brand #cokeIconSlide {
  position: relative;
  padding-bottom: 100px;
}
#container.brand #cokeIconSlide .swiper-slide {
  width: 70%;
  text-align: center;
}
#container.brand #cokeIconSlide .swiper-slide img {
  max-width: 204px;
  transform: scale(1);
  transition: all 0.3s;
}
#container.brand #cokeIconSlide .swiper-slide.swiper-slide-next img, #container.brand #cokeIconSlide .swiper-slide.swiper-slide-prev img {
  transform: scale(0.75);
}
#container.brand #cokeIconSlide .swiper-button-next, #container.brand #cokeIconSlide .swiper-button-prev {
  top: unset;
  bottom: 50px;
  height: auto;
}
#container.brand #cokeIconSlide .swiper-button-prev, #container.brand #cokeIconSlide .swiper-rtl .swiper-button-next {
  left: 0;
}
#container.brand #cokeIconSlide .swiper-button-next, #container.brand #cokeIconSlide .swiper-rtl .swiper-button-prev {
  left: 50px;
}
#container.brand #cokeIconSlide .swiper-button-next:after, #container.brand #cokeIconSlide .swiper-rtl .swiper-button-prev:after {
  content: "";
  background: url("/m/static/images/common/ico_arrow_next0.png") no-repeat center;
  background-size: 8px;
  width: 8px;
  height: 19px;
}
#container.brand #cokeIconSlide .swiper-button-prev:after, #container.brand #cokeIconSlide .swiper-rtl .swiper-button-next:after {
  content: "";
  background: url("/m/static/images/common/ico_arrow_prev0.png") no-repeat center;
  background-size: 8px;
  width: 8px;
  height: 19px;
}

#container.manufacture {
  position: relative;
}
#container.manufacture .headArea {
  margin-bottom: 7px;
}
#container.manufacture .headArea h2 {
  margin-bottom: unset;
}
#container.manufacture .videoBtn {
  position: absolute;
  top: 90px;
  right: 20px;
  display: flex;
}
#container.manufacture .videoBtn button {
  width: 40px;
  height: 40px;
  background-color: #fff;
  border: 1px solid #ddd;
}
#container.manufacture .videoBtn button#play {
  border-radius: 50%;
  margin-right: 10px;
}
#container.manufacture .videoBtn button#play.play {
  background: url("/m/static/images/common/ico_pause.png") no-repeat;
  background-position: center;
}
#container.manufacture .videoBtn button#play.pause {
  background: url("/m/static/images/common/ico_play.png") no-repeat;
  background-position: center;
}
#container.manufacture .videoBtn button#play img {
  height: 14px;
}
#container.manufacture .videoBtn button#prev img, #container.manufacture .videoBtn button#next img {
  height: 12px;
  position: relative;
  top: 1px;
}
#container.manufacture .videoBtn button#prev {
  border-radius: 50% 0 0 50%;
  border-right: unset;
}
#container.manufacture .videoBtn button#next {
  border-radius: 0 50% 50% 0;
  border-left: unset;
  position: relative;
}
#container.manufacture .videoBtn button#next:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 12px;
  background-color: #ddd;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
#container.manufacture section video {
  max-width: calc(100% + 80px);
  position: relative;
  left: -40px;
  top: 10px;
}
#container.manufacture .playerContainer {
  margin: 0 -40px;
}
#container.manufacture .playerContainer .bc-player-default_default {
  width: 100%;
  height: 500px;
}
#container.manufacture .playerContainer .vjs-dock-text {
  display: none;
}
#container.manufacture .playerContainer .video-js .vjs-tech {
  position: static;
}
#container.manufacture .playerContainer .bc-iframe, #container.manufacture .playerContainer .bc-iframe body, #container.manufacture .playerContainer .bc-player-default_default, #container.manufacture .playerContainer .bc-player-default_default .vjs-poster {
  background-color: #fff;
  background-size: cover;
}

#container.story section {
  position: relative;
  margin-bottom: 28px;
}
#container.story section .bar {
  position: absolute;
  top: 69px;
  left: 60px;
  width: 1px;
  height: calc(100% - 80px);
  background: #000;
}
#container.story section .bar .ball {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #ED1C24;
  border-radius: 50%;
  left: 50%;
  transform: translateX(-50%);
  transition: all 2s 0.5s cubic-bezier(0, 0.55, 0.45, 1);
  opacity: 0;
  top: 0;
}
#container.story section > .title {
  font-size: 38px;
  letter-spacing: -0.025em;
}
#container.story section .topCont {
  margin-left: 44px;
  padding-top: 16px;
}
#container.story section .topCont .title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 16px;
  display: block;
  line-height: 1.3em;
}
#container.story section .topCont .img {
  width: 150px;
  height: 150px;
  margin-bottom: 16px;
}
#container.story section .topCont .desc {
  color: #888888;
  font-size: 16px;
  line-height: 1.6em;
  letter-spacing: -0.025em;
  margin-bottom: 16px;
}
#container.story section .topCont .more {
  font-size: 16px;
  color: #ED1C24;
  display: block;
  margin-bottom: 16px;
}
#container.story section .topCont .more .ico {
  margin-left: 4px;
  margin-bottom: -3px;
}
#container.story section .history {
  padding: 0 0 27px;
}
#container.story section .history li {
  display: flex;
  margin-bottom: 14px;
}
#container.story section .history li .year {
  font-size: 18px;
  font-weight: 700;
  font-family: "Nanum", sans-serif;
  line-height: 1.5em;
  letter-spacing: -0.025em;
  width: 42px;
  display: block;
  flex-shrink: 0;
}
#container.story section .history li .textArea {
  margin-left: 44px;
}
#container.story.cokeHistory .topArea .mainText:before {
  content: "";
  position: absolute;
  width: 58px;
  height: 51px;
  background: url("/m/static/images/icon/illust_pen.png") no-repeat;
  background-size: 100%;
  background-position: center;
  top: 17%;
  left: 74%;
}
#container.story.cokeHistory .topArea .mainText:after {
  content: "";
  position: absolute;
  width: 28px;
  height: 41px;
  background: url("/m/static/images/icon/illust_clock.png") no-repeat;
  background-size: 100%;
  background-position: center;
  bottom: 20%;
  left: 29%;
}
#container.story .slideArea {
  height: 480px;
  width: 320px;
  margin: -16px auto 0;
  transform: translateX(-10px);
}
#container.story .swiper-slide {
  border-radius: 0 35px;
  font-size: 22px;
  font-weight: bold;
  background: #ddd;
  box-shadow: 5px 5px 10px 0 rgba(102, 102, 102, 0.15);
  padding: 32px 34px;
  transition: all 0.3s, background 0.1s;
  opacity: 0;
}
#container.story .swiper-slide:not(.first) {
  border: 1.4px solid #eee;
  position: relative;
  padding: 64px 30px;
}
#container.story .swiper-slide:not(.first) .year {
  position: absolute;
  top: 88px;
  right: -5px;
  font-size: 38px;
  font-weight: 700;
  color: #ED1C24;
  transform: rotate(90deg);
}
#container.story .swiper-slide:not(.first) .year.two {
  transform: rotate(90deg) translate(65px, -65px);
}
#container.story .swiper-slide:not(.first) .textArea {
  width: 174px;
}
#container.story .swiper-slide:not(.first) .textArea p {
  font-weight: 500;
  margin-bottom: 0;
}
#container.story .swiper-slide.first {
  background: url("/m/static/images/story/container/img_first.png") no-repeat center;
  background-size: 117%;
}
#container.story .swiper-slide.first .mainText {
  color: #fff;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.3em;
  text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.4);
}
#container.story .swiper-slide.last {
  background: #ED1C24;
  text-align: center;
}
#container.story .swiper-slide.last .imgArea {
  width: 220px;
  margin: 0 auto;
}
#container.story .swiper-slide.last .textArea {
  width: auto;
  margin-top: 10px;
}
#container.story .swiper-slide.last .textArea strong {
  color: #fff;
  font-size: 26px;
  font-weight: 600;
}
#container.story .swiper-slide.last button {
  width: 42px;
  height: 42px;
  position: absolute;
  bottom: 23px;
  left: 30px;
  padding: 0;
}
#container.story .swiper-slide.y1886 .imgArea {
  width: 144px;
  margin-left: auto;
}
#container.story .swiper-slide.y1899 .imgArea {
  width: 135px;
}
#container.story .swiper-slide.y1900 .imgArea {
  width: 135px;
}
#container.story .swiper-slide.y1916 .textArea p:nth-of-type(2) {
  width: 128px;
}
#container.story .swiper-slide.y1916 .imgArea {
  width: 131px;
  margin-left: auto;
  margin-top: -90px;
}
#container.story .swiper-slide.y1960 .imgArea {
  width: 116px;
  margin-left: auto;
}
#container.story .swiper-slide.y1977 .imgArea {
  width: 156px;
  margin-top: 77px;
}
#container.story .swiper-slide.y1991 .imgArea {
  width: 143px;
  margin-top: 77px;
}
#container.story .swiper-slide.y1993 .imgArea {
  width: 131px;
  margin-left: auto;
}
#container.story .swiper-slide.y2005 .textArea p:nth-of-type(2) {
  width: 94px;
}
#container.story .swiper-slide.y2005 .imgArea {
  width: 158px;
  margin-left: auto;
  margin-top: -80px;
}
#container.story .swiper-slide-active {
  background: #fff;
  opacity: 1;
}
#container.story .swiper-slide-next {
  background: #ED1C24;
  opacity: 1;
  margin-left: 6px;
  border: none;
}
#container.story .swiper-slide-next + .swiper-slide {
  background: #dddddd;
  opacity: 1;
  margin-left: 15px;
}
#container.story .swiper-slide-prev {
  opacity: 0;
}
#container.story .controlArea {
  position: absolute;
  top: 28px;
  left: 23px;
  width: 80px;
  height: 20px;
}
#container.story .swiper-pagination-fraction {
  bottom: 4px;
}
#container.story .swiper-pagination {
  color: #ccc;
}
#container.story .swiper-pagination-current {
  color: #000;
}
#container.story .swiper-button-next, #container.story .swiper-button-prev {
  top: 0;
  height: auto;
  margin-top: 0;
}
#container.story .swiper-button-prev, #container.story .swiper-rtl .swiper-button-next {
  left: 0;
}
#container.story .swiper-button-next, #container.story .swiper-rtl .swiper-button-prev {
  right: 0;
}
#container.story .swiper-button-next:after, #container.story .swiper-rtl .swiper-button-prev:after {
  content: "";
  background: url("/m/static/images/common/ico_arrow_next3.png") no-repeat center;
  background-size: 18px;
  width: 18px;
  height: 18px;
}
#container.story .swiper-button-prev:after, #container.story .swiper-rtl .swiper-button-next:after {
  content: "";
  background: url("/m/static/images/common/ico_arrow_prev3.png") no-repeat center;
  background-size: 18px;
  width: 18px;
  height: 18px;
}

#container.cf {
  font-family: "Nanum", sans-serif;
}
#container.cf section .cfList {
  position: relative;
}
#container.cf section .cfList li {
  position: relative;
  padding-top: 40px;
}
#container.cf section .cfList li:first-child {
  padding-top: 80px;
}
#container.cf section .cfList li.on {
  padding-top: 80px;
}
#container.cf section .cfList li.on em, #container.cf section .cfList li.on span {
  color: #fff;
  transition: 0.07s;
}
#container.cf section .cfList li.on:before {
  content: "";
  position: absolute;
  background-color: #ED1C24;
  top: 40px;
  left: -40px;
  z-index: 1;
  border-radius: 0 30px 0 0;
  width: 370px;
  height: 221px;
  animation-name: bgSlide;
  animation-duration: 0.7s;
  animation-timing-function: ease-in-out;
}
#container.cf section .cfList li.on .videoArea video {
  display: block;
}
#container.cf section .cfList li:after {
  content: "";
  position: absolute;
  width: calc(100% + 40px);
  height: 2px;
  right: -40px;
  background-color: #ED1C24;
}
#container.cf section .cfList li em {
  font-size: 14px;
  line-height: 1.5em;
  letter-spacing: -0.03em;
  display: block;
  position: relative;
  z-index: 2;
  transition: 0.07s;
}
#container.cf section .cfList li span {
  font-size: 18px;
  line-height: 1.3em;
  letter-spacing: -0.03em;
  display: block;
  margin: 3px 0 15px;
  position: relative;
  z-index: 2;
  transition: 0.07s;
}
#container.cf section .cfList li .videoArea {
  width: 310px;
  height: 174px;
  position: relative;
  margin: 0 auto 30px;
  z-index: 22;
}
#container.cf section .cfList li .videoArea .videoCover {
  display: block;
  width: 310px;
  height: 174px;
  position: absolute;
  z-index: 33;
}
#container.cf section .cfList li .videoArea .videoCover.off {
  display: none;
}
#container.cf section .cfList li .videoArea video {
  width: 310px;
  height: 174px;
  background-color: #000;
  display: none;
}
@media (max-width: 390px) {
  #container.cf section .cfList li .videoArea {
    left: 50%;
    transform: translateX(-50%);
  }
}
#container.cf section .cfList li .subtitle {
  margin-bottom: 37px;
  display: none;
  opacity: 1;
  animation-name: subSlide;
  animation-duration: 1s;
}
#container.cf section .cfList li .subtitle strong {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4em;
  letter-spacing: -0.03em;
  margin-bottom: 17px;
  display: block;
}
#container.cf section .cfList li .subtitle div {
  font-size: 14px;
  line-height: 1.6em;
  letter-spacing: -0.03em;
}
#container.cf section .pagination {
  padding-top: 40px;
}

@keyframes bgSlide {
  0% {
    width: 190px;
    height: 221px;
  }
  100% {
    width: 370px;
    height: 221px;
  }
}
@keyframes subSlide {
  0% {
    opacity: 0;
    display: none;
  }
  100% {
    opacity: 1;
    display: block;
  }
}
#container.ad h3.lineRed {
  font-size: 30px;
  font-weight: 400;
}
#container.ad .adSlide {
  position: relative;
}
#container.ad .adSlide .title {
  font-size: 18px;
  font-weight: 600;
  font-family: "Nanum", sans-serif;
  margin-top: 30px;
  display: block;
  width: calc(100% - 60px);
}
#container.ad .adSlide .swiper-slide .title {
  transition: all 0.3s 0.2s;
}
#container.ad .adSlide .swiper-slide .imgArea {
  transition: all 0.3s;
  height: 482px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#container.ad .adSlide .swiper-slide-active .title {
  opacity: 1;
}
#container.ad .adSlide .swiper-slide-active .imgArea {
  transform: scale(1);
}
#container.ad .adSlide .swiper-slide-next, #container.ad .adSlide .swiper-slide-prev {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
#container.ad .adSlide .swiper-slide-next .imgArea, #container.ad .adSlide .swiper-slide-prev .imgArea {
  transform: scale(0.85);
}
#container.ad .adSlide .swiper-slide-next .title, #container.ad .adSlide .swiper-slide-prev .title {
  opacity: 0;
}
#container.ad .adSlide .swiper-pagination-fraction {
  width: 58px;
  height: 58px;
  background: #000;
  text-align: center;
  padding: 20px 0;
  top: 508px;
  right: 0;
  left: unset;
  font-size: 14px;
  color: #ccc;
}
#container.ad .adSlide .swiper-pagination-fraction .swiper-pagination-current {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}
#container.ad .adSlide .swiper-pagination-fraction .swiper-pagination-total {
  font-size: 14px;
  color: #ccc;
}

#container.notice .topArea {
  margin-bottom: 42px;
}
#container.notice .noticeArea {
  position: relative;
  margin-bottom: 30px;
  width: 100%;
}
#container.notice .noticeArea ul {
  position: absolute;
  z-index: 10;
  width: 100%;
}
#container.notice .noticeArea ul li {
  padding-right: 20%;
  margin-bottom: 16px;
}
#container.notice .noticeArea ul li .title {
  font-size: 20px;
  line-height: 1.5em;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  margin-bottom: 14px;
  font-weight: 400;
}
#container.notice .noticeArea ul li .date {
  font-size: 12px;
  font-family: "Nanum", sans-serif;
}
#container.notice .colorBgBox {
  height: 328px;
  width: 200vw;
  margin-left: -50vw;
  opacity: 1;
  position: absolute;
}
#container.notice .colorBgBox:nth-child(2n) {
  background: #D50011;
  transform: rotate(-12deg);
}
#container.notice .colorBgBox:nth-child(2n+1) {
  background: #000;
  transform: rotate(12deg);
}
#container.notice .colorBgBox.idx1 {
  top: 0;
}
#container.notice .colorBgBox.idx2 {
  top: 530px;
}
#container.notice .bottomArea {
  text-align: center;
}
#container.notice.view .topArea {
  border-top: 1px solid #000;
  border-bottom: 1px solid #dddddd;
  padding: 30px 25px 20px;
  font-family: "Nanum", sans-serif;
  margin-bottom: 0;
}
#container.notice.view .topArea .title {
  font-size: 16px;
  letter-spacing: -0.025em;
  display: block;
  margin-bottom: 9px;
}
#container.notice.view .topArea .date {
  font-size: 16px;
  color: #888888;
}
#container.notice.view .contArea {
  padding: 58px 25px 60px;
  line-height: 1.5em;
  border-bottom: 1px solid #dddddd;
}
#container.notice.view .bottomArea {
  padding: 40px 25px 0;
}
#container.notice.view .bottomArea .btnArea {
  margin-top: 30px;
}
#container.notice .none {
  text-align: center;
  padding-top: 20px;
}
#container.notice .none .img {
  width: 74px;
  margin: 0 auto;
}
#container.notice .none .alert {
  color: #000;
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.025em;
  display: inline-block;
  margin-top: 30px;
}
#container.notice .none + .bottomArea {
  display: none;
}

#container.event .eventArea {
  margin-bottom: 40px;
}
#container.event .eventArea ul li:not(.none) {
  overflow: hidden;
  padding: 0;
  margin-bottom: 23px;
  position: relative;
  border-radius: 30px 0 30px 0;
}
#container.event .eventArea ul li:not(.none) .thumb {
  width: 100%;
  height: 451px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
}
#container.event .eventArea ul li:not(.none) .textWrap {
  padding: 20px;
  padding-right: 40%;
}
#container.event .eventArea ul li:not(.none) .title {
  font-size: 24px;
  font-weight: 700;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  line-height: 1.3em;
  margin-bottom: 14px;
}
#container.event .eventArea ul li:not(.none) .date {
  font-size: 14px;
  color: #aaa;
  font-family: "Nanum", sans-serif;
}
#container.event .eventArea ul li:not(.none).endEvent .title {
  color: #888888;
}
#container.event .eventArea ul li:not(.none).endEvent:after {
  content: "종료";
  position: absolute;
  bottom: 0;
  right: 0;
  color: #888888;
  background: #C7C7C7;
  text-align: center;
  padding: 18px 20px;
  border-radius: 30px 0 0 0;
}
#container.event .none {
  border: none;
  padding: 0;
  text-align: center;
}
#container.event .none .img {
  width: 74px;
  margin: 0 auto;
}
#container.event .none .alert {
  color: #000;
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.025em;
  display: inline-block;
  margin-top: 30px;
}
#container.event .bgArea div {
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  transition: all 0.5s;
}
#container.event .bgArea div#yellow {
  background-image: url("/m/static/images/news/bg_yello.png");
  width: 347px;
  height: 278px;
  top: 715px;
  left: -40px;
}
#container.event .bgArea div#red {
  background-image: url("/m/static/images/news/bg_red.png");
  width: 208px;
  height: 258px;
  top: 390px;
  right: 0;
}
#container.event .bgArea div#black {
  background-image: url("/m/static/images/news/bg_black.png");
  width: 152px;
  height: 225px;
  top: 461px;
  right: 0;
}
#container.event .bgArea div#green {
  background-image: url("/m/static/images/news/bg_green.png");
  width: 143px;
  height: 210px;
  top: 193px;
  left: -40px;
}
#container.event .bottomArea {
  text-align: center;
}

#container.faq .topArea {
  margin-bottom: 40px;
}
#container.faq #faqList li {
  margin-top: 15px;
  padding-left: 36px;
}
#container.faq #faqList li > p {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5em;
}
#container.faq #faqList li > p:before {
  content: "Q";
  font-size: 16px;
  color: #ED1C24;
  display: block;
  padding: 0 10px;
  position: absolute;
  top: 18px;
  left: 3px;
}
#container.faq #faqList li:first-child {
  margin-top: 0;
}
#container.faq #faqList li .hidden {
  margin-left: -36px;
}
#container.faq #faqList .hiddenBox p * {
  font-size: 16px;
  color: #fff !important;
  background: #000 !important;
  font-family: "Nanum", sans-serif !important;
  line-height: 1.3em !important;
}

#container.voice .topArea .mainText:before {
  content: "";
  position: absolute;
  background: url("/m/static/images/icon/illust_bubble.png") no-repeat;
  background-size: 100%;
  background-position: center;
  width: 54px;
  height: 38px;
  top: 35%;
  left: 50%;
}
#container.voice .agreeArea {
  margin-top: 40px;
}
#container.voice .agreeArea .chkboxArea label {
  display: flex;
  align-items: center;
  word-break: break-all;
  font-size: 14px;
}
#container.voice .agreeArea .label a.important {
  float: right;
  font-weight: 400;
}
#container.voice .infoArea {
  background: #f5f5f5;
  padding: 20px 23px;
}
#container.voice .infoArea ul li {
  border-bottom: 1px solid #ddd;
  padding: 17px 0;
}
#container.voice .infoArea ul li:first-child {
  padding-top: 0;
}
#container.voice .infoArea ul li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
#container.voice .infoArea ul li strong {
  font-size: 16px;
  font-weight: 600;
}
#container.voice .infoArea ul li a {
  display: flex;
  align-items: center;
  margin-top: 8px;
  font-size: 14px;
  font-family: "Nanum", sans-serif;
}
#container.voice .infoArea ul li a .ico.tel {
  margin-right: 6px;
}
#container.voice .bottomArea {
  padding-top: 40px;
}

#container.newAplli .topArea .mainText:before {
  content: "";
  position: absolute;
  background: url("/m/static/images/icon/illust_message.png") no-repeat;
  background-size: 100%;
  background-position: center;
  width: 47px;
  height: 37px;
  top: 27%;
  left: 76%;
}
#container.newAplli .topArea .mainText:after {
  content: "";
  position: absolute;
  background: url("/m/static/images/icon/illust_coffee.png") no-repeat;
  background-size: 100%;
  background-position: center;
  width: 40px;
  height: 42px;
  top: 75%;
  left: 39%;
}
#container.newAplli .appliFlow .flow {
  background: url("/m/static/images/common/flow_line.png") no-repeat 50% 50%;
  background-size: 313px;
  padding: 0 30px;
  width: 313px;
}
#container.newAplli .appliFlow .flow li {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.025em;
  display: flex;
  align-items: flex-end;
  margin-bottom: 50px;
}
#container.newAplli .appliFlow .flow li .ico {
  font-size: 14px;
  font-family: "Nanum", sans-serif;
  font-weight: 600;
  width: 64px;
  height: 42px;
  background-position: 100% 100%;
  background-size: 40px;
  margin-right: 20px;
}
#container.newAplli .section3 .info {
  display: block;
  font-size: 15px;
}
#container.newAplli .section3 .info strong {
  font-weight: 600;
}
#container.newAplli .section4 .inputArea .inputWrap {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}
#container.newAplli .section4 .inputArea .inputWrap #postNo {
  width: 70%;
  margin-right: 10px;
}
#container.newAplli .section4 .inputArea .inputWrap #postNo + .btnTypeA {
  background: #000;
  color: #fff;
  font-size: 16px;
  padding: 19px 22px;
  width: 31%;
  min-width: 100px;
  text-align: center;
  margin-bottom: 0;
  letter-spacing: -0.025em;
}
#container.newAplli .section4 .inputArea #addr1 {
  margin-bottom: 10px;
}
#container.newAplli .agreeArea {
  margin-top: 40px;
}
#container.newAplli .agreeArea .chkboxArea label {
  display: flex;
  align-items: center;
  word-break: break-all;
  font-size: 14px;
}
#container.newAplli .agreeArea .label a.important {
  float: right;
  font-weight: 400;
}

#container.cokeSoda .ico.airplane {
  background: url("/m/static/images/company/cokeSoda_paperplane.png") no-repeat center;
  background-size: 100%;
  width: 139px;
  height: 64px;
  background-size: cover;
  top: 32%;
  left: 46%;
  position: absolute;
}
#container.cokeSoda .ico.star {
  background: url("/m/static/images/company/cokeSoda_star.png") no-repeat center;
  background-size: 100%;
  width: 37px;
  height: 31px;
  background-size: cover;
  display: inline-block;
}
#container.cokeSoda .headArea {
  margin-bottom: 10px;
}
#container.cokeSoda .headArea h2 {
  margin-bottom: 20px;
}
#container.cokeSoda .topArea .imgArea {
  transform: translateX(-25px);
  width: 275px;
}
#container.cokeSoda .topArea .subText {
  width: 264px;
  margin-bottom: 60px;
}
#container.cokeSoda .imgArea.img1 {
  background-image: url("/m/static/images/company/cokeSoda_img0.png");
  height: 257px;
  width: calc(100% + 40px);
}
#container.cokeSoda .motion {
  position: relative;
}
#container.cokeSoda .motion .bigText {
  font-size: 68px;
  letter-spacing: -0.05em;
  font-family: "Noto Sans CJK KR", Tahoma, Arial, sans-serif;
  font-weight: 700;
  display: block;
}
#container.cokeSoda .motion#mo2 {
  height: 381px;
  padding-top: 68px;
}
#container.cokeSoda .motion#mo2 .bigText {
  position: absolute;
}
#container.cokeSoda .motion#mo2 .bigText:nth-of-type(1) {
  top: 68px;
  left: -50px;
  opacity: 0.2;
  transition: all 0.6s;
}
#container.cokeSoda .motion#mo2 .bigText:nth-of-type(2) {
  top: 137px;
  left: 105px;
  opacity: 0.2;
  transition: all 0.6s;
}
#container.cokeSoda .motion#mo2 .bigText:nth-of-type(3) {
  top: 203px;
  right: -50px;
  opacity: 0.2;
  transition: all 0.6s;
}
#container.cokeSoda .motion#mo2 .img {
  position: absolute;
  top: -50px;
  right: -40px;
  height: 381px;
  opacity: 0.2;
  transition: all 0.6s;
}
#container.cokeSoda .motion#mo2.on .bigText {
  position: absolute;
}
#container.cokeSoda .motion#mo2.on .bigText:nth-of-type(1) {
  top: 68px;
  left: 0;
  opacity: 1;
}
#container.cokeSoda .motion#mo2.on .bigText:nth-of-type(2) {
  top: 137px;
  left: 75px;
  opacity: 1;
}
#container.cokeSoda .motion#mo2.on .bigText:nth-of-type(3) {
  top: 203px;
  right: 0;
  opacity: 1;
}
#container.cokeSoda .motion#mo2.on .img {
  position: absolute;
  top: 0;
  right: -40px;
  height: 381px;
  opacity: 1;
}
#container.cokeSoda .textArea {
  width: 275px;
  margin-left: auto;
}
#container.cokeSoda .textArea .title {
  font-size: 24px;
  letter-spacing: -0.015em;
  line-height: 32px;
  margin-bottom: 29px;
  font-weight: 700;
}
#container.cokeSoda .textArea p {
  margin-bottom: 20px;
}
#container.cokeSoda .textArea p strong {
  font-weight: 700;
}
#container.cokeSoda section {
  width: calc(100% + 20px);
}
#container.cokeSoda .section1 {
  margin-top: 40px;
}
#container.cokeSoda .section2 {
  margin-top: 23px;
}

#container.history .topArea .mainText:before {
  content: "";
  position: absolute;
  width: 71px;
  height: 125px;
  top: 22%;
  left: 66%;
  background: url("/m/static/images/icon/illust_cola.png") no-repeat;
  background-position: center;
  background-size: cover;
}
#container.history section {
  margin-right: -40px;
}
#container.history section .titleArea {
  padding-right: 10px;
}
#container.history section .titleArea strong {
  font-family: "AdobeArabic", Tahoma, Arial, sans-serif;
  font-size: 145px;
  display: flex;
  justify-content: flex-end;
  position: relative;
}
#container.history section .titleArea strong span {
  display: inline-block;
  width: 50px;
  height: 145px;
  overflow: hidden;
  transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  opacity: 0.2;
}
#container.history section .titleArea strong span:nth-child(2n) {
  transform: translateY(32px);
}
#container.history section .titleArea strong span:nth-child(2n+1) {
  transform: translateY(-48px);
}
#container.history section .titleArea strong span:nth-of-type(5) {
  width: 19px;
}
#container.history section .titleArea strong span:nth-of-type(6) {
  width: 39px;
}
#container.history section .titleArea strong span em {
  display: inline-block;
}
#container.history section .titleArea .motion.on strong span {
  opacity: 1;
}
#container.history section .titleArea .motion.on strong span:nth-child(2n) {
  transform: translateY(0);
}
#container.history section .titleArea .motion.on strong span:nth-child(2n+1) {
  transform: translateY(-16px);
}
#container.history section.y1990 .titleArea .motion.on strong span em:nth-of-type(1) {
  animation: up1 1.2s calc(0.8s * 1) cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
#container.history section.y1990 .titleArea .motion.on strong span em:nth-of-type(2) {
  animation: up1 1.2s calc(0.8s * 1) cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes up1 {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-145px);
  }
}
#container.history section.y1970 .titleArea .motion.on strong span em:nth-of-type(1) {
  animation: up1 1.2s calc(0.8s * 1) cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
#container.history section.y1970 .titleArea .motion.on strong span em:nth-of-type(2) {
  animation: up2 2.4s calc(0.8s * 1) cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
#container.history section.y1970 .titleArea .motion.on strong span em:nth-of-type(3) {
  transform: translateY(-145px);
  animation: up3 1.2s 2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes up1 {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-145px);
  }
}
@keyframes up2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-145px);
  }
  100% {
    transform: translateY(-290px);
  }
}
@keyframes up3 {
  0% {
    transform: translateY(-145px);
  }
  100% {
    transform: translateY(-290px);
  }
}
#container.history section .historyList {
  margin-top: 30px;
}
#container.history section .historyList .yearWrap {
  margin-bottom: 56px;
  padding-left: 34px;
}
#container.history section .historyList .yearWrap > li {
  margin-top: 30px;
}
#container.history section .historyList .yearWrap > li .year {
  font-size: 24px;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.025em;
  display: block;
  padding-bottom: 6px;
  border-bottom: 1px solid #dddddd;
}
#container.history section .historyList .yearWrap .monthWrap {
  margin-top: 14px;
}
#container.history section .historyList .yearWrap .monthWrap > li {
  font-family: "Nanum", sans-serif;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin-top: 12px;
  padding-right: 56px;
}
#container.history section .historyList .yearWrap .monthWrap > li .month {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.3em;
  min-width: 32px;
}
#container.history section .historyList .yearWrap .monthWrap > li .desc {
  font-size: 16px;
  letter-spacing: -0.025em;
  line-height: 1.3em;
  margin-left: 20px;
  margin-top: 10px;
}
#container.history section .historyList .yearWrap .monthWrap > li .desc:nth-of-type(1) {
  margin-top: 0;
}

#container.ceoMessage .topArea .mainText {
  font-size: 24px;
  line-height: 1.35em;
  font-weight: 600;
  background: url("/m/static/images/company/comment.png") no-repeat bottom left;
  background-size: contain;
  padding-bottom: 20px;
}
#container.ceoMessage .topArea .subText {
  width: 275px;
  margin-left: auto;
}
#container.ceoMessage .imgArea {
  padding-top: 40px;
  margin-bottom: 40px;
}

#container.LGway .topArea .subText {
  margin-top: 38px;
}
#container.LGway #mo1 {
  height: 473px;
  position: relative;
  margin: 60px -40px;
}
#container.LGway #mo1 > div {
  position: absolute;
}
#container.LGway #mo1 > div .text {
  font-size: 16px;
  color: #fff;
  letter-spacing: -0.025em;
  line-height: 1.5em;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s;
}
#container.LGway #mo1 > div .text.on {
  opacity: 1;
}
#container.LGway #mo1 .circle {
  border-radius: 50%;
}
#container.LGway #mo1 .circle.red {
  background: #ED1C24;
  width: 126px;
  height: 126px;
  top: 0;
  left: 2%;
  transform: translateX(-50%);
}
#container.LGway #mo1 .circle.white {
  border: 1px solid #666666;
  width: 255px;
  height: 255px;
  top: 180px;
  left: -30%;
}
#container.LGway #mo1 .circle.white .text {
  color: #000;
  font-weight: 700;
}
#container.LGway #mo1 .halfCircle {
  overflow: hidden;
  height: 101px;
  margin-right: -101px;
  top: 100px;
  right: 2%;
  transform: rotate(148deg);
}
#container.LGway #mo1 .halfCircle .shape {
  background: #000;
  width: 203px;
  height: 203px;
  border-radius: 50%;
  display: block;
}
#container.LGway #mo1 .halfCircle .text {
  transform: rotate(180deg) translate(50%, 50%);
}
#container.LGway #mo2 {
  position: relative;
  width: calc(100% + 40px);
  margin-top: 40px;
  background-image: url("/m/static/images/company/lgway01.png");
  height: 257px;
}
#container.LGway section .textArea .title {
  margin-top: 40px;
  margin-bottom: 16px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.025em;
}
#container.LGway .section2 {
  margin-top: 50px;
}

#container.manageProgram .topArea .subText {
  width: 274px;
  margin-left: auto;
}
#container.manageProgram .programArea .imgArea {
  margin: 40px -40px 10px;
}
#container.manageProgram .programArea .textBox {
  margin-top: 30px;
}
#container.manageProgram .programArea .textBox .title {
  font-size: 24px;
  margin-bottom: 15px;
  font-weight: 700;
  line-height: 1.3em;
  letter-spacing: -0.025em;
}
#container.manageProgram .programArea .textBox .title span {
  display: inline-block;
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  color: #ED1C24;
  margin-bottom: 5px;
}
#container.manageProgram .programArea .textBox p {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  line-height: 1.6em;
}

#container.moral .visual {
  background-image: url("/m/static/images/company/topBg_moralCode.png") !important;
}

#container.cyber.topFix {
  padding-top: 540px;
}
#container.cyber .visual {
  height: 480px;
  margin: -27px -40px 0;
  padding: 27px 40px 0;
  background-image: url("/m/static/images/company/topBg_cyber.png");
}
#container.cyber .visual h2 {
  color: #000;
}
#container.cyber .visual .mainText {
  font-size: 8.4vw;
  margin-bottom: 38px;
  line-height: 1.25em;
  position: relative;
  white-space: nowrap;
  letter-spacing: -0.05em;
  font-weight: 400;
  color: #000;
}
#container.cyber .visual .mainText strong {
  font-weight: 600;
}
#container.cyber .textArea.typeA:last-of-type p.sizeM {
  margin-bottom: 35px;
}
#container.cyber .cyberBtn {
  display: inline-block;
  position: relative;
  float: right;
  margin-top: 45px;
  padding: 13px 0 13px 53px;
  font-size: 14px;
  font-family: "Nanum", sans-serif;
  background: url("/m/static/images/icon/ico_test.png") center left no-repeat;
  background-size: 44px 40px;
}
#container.cyber .cyberBtn:after {
  content: "";
  display: block;
  width: 88px;
  height: 7px;
  background: url("/m/static/images/icon/ico_arrow.png") center no-repeat;
  background-size: cover;
  position: absolute;
  right: -10px;
  bottom: 5px;
}

#container.community.topFix {
  padding-top: 540px;
}
#container.community .visual {
  background-image: url("/m/static/images/company/topBg_community.png");
}
#container.community .visual .headArea .location {
  color: #fff;
}
#container.community .topArea {
  margin-top: 40px;
}
#container.community .communityArea section .listArea.dot-red {
  margin-top: 30px;
}
#container.community section .tblWrap {
  overflow-x: auto;
  margin-right: -40px;
  padding-right: 40px;
}
#container.community section .tblWrap table {
  width: 720px;
  height: 400px;
  margin-bottom: 16px;
}
#container.community section .tblWrap table tbody {
  border: 1px solid #ddd;
  border-right: none;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}
#container.community section .tblWrap table tbody tr th {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background-color: #f5f5f5;
}
#container.community section .tblWrap table tbody tr td {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  text-align: center;
  color: #888;
  padding: 0 10px;
}
#container.community section .tblWrap table tbody tr td.txtRed {
  color: #ED1C24;
}
#container.community section .product {
  margin-top: 16px;
}
#container.community section .product ul {
  overflow: hidden;
}
#container.community section .product ul li {
  width: calc(50% - 5px);
  float: left;
}
#container.community section .product ul li:nth-child(odd) {
  margin-right: 5px;
}
#container.community section .product ul li:nth-child(even) {
  margin-left: 5px;
}
#container.community section .product ul li img {
  width: 150px;
  max-width: 100%;
  height: 170px;
  background-color: #F9F9F9;
  margin: 0 auto;
}
#container.community section .product ul li p {
  margin: 16px 0 30px;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.02em;
}
#container.community section .product ul li p span {
  color: #ED1C24;
}
#container.community section .salesField {
  font-family: "Nanum", sans-serif;
}
#container.community section .salesField:nth-child(2) > .title {
  padding-top: 0;
}
#container.community section .salesField .title {
  line-height: 26px;
  padding: 25px 0 20px;
  border-bottom: 1px solid #000;
}
#container.community section .salesField .title strong {
  font-size: 18px;
  color: #ED1C24;
  font-weight: 700;
}
#container.community section .salesField .title p {
  font-size: 16px;
}
#container.community section .salesField .salesList li {
  padding: 11px 0;
  border-bottom: 1px solid #ddd;
}
#container.community section .salesField .salesList li strong {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.5em;
  padding-right: 6px;
  border-right: 1px solid #ddd;
}
#container.community section .salesField .salesList li span {
  font-size: 16px;
  padding-left: 9px;
  letter-spacing: -0.02em;
  line-height: 1.6em;
}
#container.community section .salesField .salesList li p {
  font-size: 14px;
  line-height: 1.5em;
}
#container.community .download {
  margin-top: 40px;
  background-color: #000;
  color: #fff;
  font-family: "Nanum", sans-serif;
  letter-spacing: -0.03em;
  font-size: 18px;
  text-align: center;
  width: 100%;
  display: block;
  padding: 17px 0;
}

#container.community .communityArea1 .pageText {
  margin: 60px 0 25px;
  font-family: "Nanum", sans-serif;
  font-size: 18px;
  line-height: 1.5em;
}
#container.community .communityArea1 .activeStory {
  border-bottom: 1px solid #ddd;
}
#container.community .communityArea1 .activeStory > li > span {
  display: block;
  font-family: "Nanum", sans-serif;
  font-size: 18px;
  border-top: 1px solid #ddd;
  padding: 16px 0;
  position: relative;
  line-height: 1.2em;
}
#container.community .communityArea1 .activeStory > li > span:after {
  content: "";
  display: block;
  width: 15px;
  height: 17px;
  background: url("/m/static/images/common/ico_arrow_down.png") center no-repeat;
  background-size: contain;
  position: absolute;
  right: 10px;
  top: 30%;
}
#container.community .communityArea1 .activeStory > li > span.on {
  color: #ED1C24;
  border-bottom: 1px solid #ED1C24;
}
#container.community .communityArea1 .activeStory > li > span.on:after {
  width: 31px;
  background: url("/m/static/images/common/ico_back.png") center no-repeat;
  background-size: cover;
  right: 2px;
  transform: rotate(90deg);
}
#container.community .communityArea1 .activeStory > li > div {
  display: none;
  margin: 30px 0 60px;
}
#container.community .communityArea1 .activeStory > li > div img {
  width: 100%;
}
#container.community .communityArea1 .activeStory > li > div .num {
  display: inline-block;
  color: #000;
  margin: 40px 0 20px;
  line-height: 1.5em;
}
#container.community .communityArea1 .activeStory > li > div .num span {
  color: #ED1C24;
}
#container.community .communityArea1 .activeStory > li > div .text {
  font-size: 16px;
  line-height: 1.6em;
}
#container.community .communityArea1 .activeStory > li > div .subText {
  font-size: 14px;
  line-height: 1.5em;
}
#container.community .communityArea1 .activeStory > li > div .imgArea01 {
  margin: 0 -40px 40px 0;
  overflow-x: auto;
}
#container.community .communityArea1 .activeStory > li > div .imgArea01 .wrap {
  width: 640px;
}
#container.community .communityArea1 .activeStory > li > div .imgArea01 img {
  width: calc(100% - 20px);
}
#container.community .communityArea1 .activeStory > li > div .imgArea02 {
  margin: 0 -40px 40px 0;
  overflow-x: auto;
}
#container.community .communityArea1 .activeStory > li > div .imgArea02 .wrap {
  width: 1975px;
}
#container.community .communityArea1 .activeStory > li > div .imgArea02 img {
  width: calc(100% - 20px);
}
#container.community .communityArea1 .activeStory > li > div .mt10 {
  margin-top: 10px;
}
#container.community .communityArea1 .activeStory > li > div .mb10 {
  margin-bottom: 10px;
}
#container.community .communityArea1 .activeStory > li > div .mt40 {
  margin-top: 40px;
}
#container.community .communityArea1 .activeStory > li > div .mb40 {
  margin-bottom: 40px;
}
#container.community .communityArea1 .activeStory > li.story08 .yearWrap {
  display: flex;
  padding-bottom: 5px;
  margin-bottom: 60px;
  overflow-x: scroll;
}
#container.community .communityArea1 .activeStory > li.story08 .yearWrap li {
  color: #ddd;
  font-size: 16px;
  font-weight: 700;
  padding: 0 10px 10px;
  border-bottom: 1px solid #ddd;
}
#container.community .communityArea1 .activeStory > li.story08 .yearWrap li:first-of-type {
  margin-left: -10px;
}
#container.community .communityArea1 .activeStory > li.story08 .yearWrap li.on {
  color: #ED1C24;
}
#container.community .communityArea1 .activeStory > li.story08 .yearWrap li.on a:after {
  content: "";
  display: block;
  width: 100%;
  height: 3px;
  background: #ED1C24;
  border-radius: 2px;
  position: absolute;
  left: 0;
  bottom: -12px;
}
#container.community .communityArea1 .activeStory > li.story08 .yearWrap li a {
  display: inline-block;
  text-align: center;
  position: relative;
}
#container.community .communityArea1 .activeStory > li.story08 .section {
  display: none;
}
#container.community .communityArea1 .activeStory > li.story08 .section.on {
  display: block;
}
#container.community .communityArea1 .activeStory > li.story08 .section .title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3em;
}
#container.community .communityArea1 .activeStory > li.story08 .section .num {
  display: block;
  margin: 0 0 20px;
}
#container.community .communityArea1 .activeStory > li.story08 .section .num:last-of-type {
  margin: 0;
}

#container.cokeSports .topArea .mainText:before {
  content: "";
  position: absolute;
  width: 50px;
  height: 36px;
  top: 42%;
  left: 60%;
  background: url("/m/static/images/icon/illust_ball.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
#container.cokeSports .topArea .mainText:after {
  content: "";
  position: absolute;
  width: 39px;
  height: 46px;
  top: 59%;
  left: 37%;
  background: url("/m/static/images/icon/illust_flag.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
#container.cokeSports .topArea .subText {
  width: 274px;
  margin-bottom: 40px;
}
#container.cokeSports .imgArea.img1 {
  height: 257px;
  width: calc(100% + 40px);
  background-image: url("/m/static/images/company/cokeSports1.jpg");
}
#container.cokeSports .imgArea.img2 {
  height: 257px;
  width: calc(100% + 40px);
  margin-left: -40px;
  background-image: url("/m/static/images/company/cokeSports2.jpg");
}
#container.cokeSports .textArea .title {
  font-size: 24px;
  letter-spacing: -0.015em;
  line-height: 32px;
  margin-bottom: 29px;
  font-weight: 700;
}
#container.cokeSports .textArea p {
  margin-bottom: 20px;
}
#container.cokeSports .textArea p strong {
  font-weight: 700;
}
#container.cokeSports section {
  width: calc(100% + 20px);
}
#container.cokeSports .section1 {
  margin-top: 40px;
  margin-bottom: 60px;
}
#container.cokeSports .section2 {
  margin-top: 40px;
}

#container.recruit .topArea .mainText:before {
  content: "";
  position: absolute;
  width: 62px;
  height: 44px;
  top: -11%;
  left: 58%;
  background: url("/m/static/images/icon/illust_butterfly.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
#container.recruit .topArea .mainText:after {
  content: "";
  position: absolute;
  width: 46px;
  height: 40px;
  top: 50%;
  left: 21%;
  background: url("/m/static/images/icon/illust_ship.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
#container.recruit section .textArea {
  margin-top: -4px;
}
#container.recruit section .textArea p strong {
  font-weight: 600;
}
#container.recruit section .pointB {
  font-size: 14px;
  font-family: "Nanum", sans-serif;
  display: block;
  margin-top: 20px;
  line-height: 1.5em;
}
#container.recruit .recruitFlow {
  margin-top: 58px;
}
#container.recruit .recruitFlow .flow {
  padding-left: 40px;
}
#container.recruit .recruitFlow .flow li {
  position: relative;
  width: 100%;
  margin-bottom: 38px;
  padding-top: 28px;
}
#container.recruit .recruitFlow .flow li .number {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
  color: #fff;
  background: #000;
  width: 28px;
  height: 28px;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
}
#container.recruit .recruitFlow .flow li:nth-of-type(3) .number {
  z-index: 5;
}
#container.recruit .recruitFlow .flow li .ico {
  position: absolute;
  top: 0;
  left: 14px;
  width: 54px;
  height: 60px;
  background-size: 40px;
  background-position: 100% 100%;
}
#container.recruit .recruitFlow .flow li .ico.document {
  left: 3px;
}
#container.recruit .recruitFlow .flow li .ico.test {
  background-size: 45px;
  left: 10px;
}
#container.recruit .recruitFlow .flow li .ico.talk {
  background-size: 44px;
  top: 4px;
  left: 5px;
}
#container.recruit .recruitFlow .flow li .ico.member {
  left: 3px;
}
#container.recruit .recruitFlow .flow li .ico.nametag {
  background-size: 44px;
  top: 4px;
  left: 3px;
}
#container.recruit .recruitFlow .flow li strong {
  padding-top: 13px;
  margin-left: 73px;
  border-top: 1px solid #000;
  display: block;
  width: calc(100% + 40px);
}
#container.recruit #faqList li {
  margin-top: 15px;
  padding-left: 36px;
}
#container.recruit #faqList li > p {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5em;
}
#container.recruit #faqList li > p:before {
  content: "Q";
  font-size: 16px;
  color: #ED1C24;
  display: block;
  padding: 0 10px;
  position: absolute;
  top: 18px;
  left: 3px;
}
#container.recruit #faqList li:first-child {
  margin-top: 0;
}
#container.recruit #faqList li .hidden {
  margin-left: -36px;
}

#container.welfare .topArea {
  overflow: hidden;
}
#container.welfare .topArea strong.mainText {
  font-size: 34px;
  line-height: 1.25em;
  position: relative;
}
#container.welfare .topArea strong.mainText:before {
  content: "";
  position: absolute;
  width: 66px;
  height: 50px;
  top: 18%;
  left: 50%;
  background: url("/m/static/images/icon/illust_house.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
#container.welfare .topArea strong.mainText:after {
  content: "";
  position: absolute;
  width: 43px;
  height: 34px;
  bottom: 1%;
  left: 72%;
  background: url("/m/static/images/icon/illust_plant.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
@media (max-width: 370px) {
  #container.welfare .topArea strong.mainText:before {
    left: 53%;
  }
  #container.welfare .topArea strong.mainText:after {
    left: 76%;
  }
}
#container.welfare .topArea strong.subText {
  width: 250px;
}
#container.welfare .welfareArea .imgArea {
  width: 100vw;
  height: 272px;
  margin: 60px 0 40px;
  position: relative;
  left: -40px;
}
#container.welfare .welfareArea .imgArea:first-of-type {
  background-image: url("/m/static/images/company/welfare1.png");
}
#container.welfare .welfareArea .imgArea:last-of-type {
  background-image: url("/m/static/images/company/welfare2.png");
}
#container.welfare .welfareArea .textBox {
  margin-top: 30px;
}
#container.welfare .welfareArea .textBox .title {
  font-size: 24px;
  margin-bottom: 15px;
  font-weight: 700;
  line-height: 1.3em;
  letter-spacing: -0.025em;
}
#container.welfare .welfareArea .textBox .title span {
  display: inline-block;
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  color: #ED1C24;
  margin-bottom: 5px;
}
#container.welfare .welfareArea .textBox p {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  line-height: 1.6em;
}

.facHistory .locInfo {
  margin-top: 40px;
}
.facHistory .locInfo p, .facHistory .locInfo a {
  font-family: "Nanum", sans-serif;
  font-size: 16px;
  line-height: 1.6em;
  letter-spacing: -0.04em;
  position: relative;
  padding-left: 25px;
}
.facHistory .locInfo p.tel:before, .facHistory .locInfo a.tel:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: url("/m/static/images/icon/ic_call_40.png") center no-repeat;
  background-size: 100%;
  left: 0;
}
.facHistory .locInfo p.address:before, .facHistory .locInfo a.address:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: url("/m/static/images/icon/ic_place_40.png") center no-repeat;
  background-size: 100%;
  left: 0;
}
.facHistory .locInfo p.map, .facHistory .locInfo a.map {
  text-decoration: underline;
}
.facHistory .locInfo p.map:before, .facHistory .locInfo a.map:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: url("/m/static/images/icon/ic_pin_40.png") center no-repeat;
  background-size: 100%;
  left: 0;
}
.facHistory .section1 {
  font-family: "Nanum", sans-serif;
}
.facHistory .section1 .facHistoryList li strong {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: -0.04em;
  display: block;
  border-bottom: 1px solid #ddd;
  padding-bottom: 7px;
  margin-bottom: 11px;
}
.facHistory .section1 .facHistoryList li ul li {
  font-size: 16px;
  letter-spacing: -0.02em;
  margin-bottom: 8px;
}
.facHistory .section1 .facHistoryList li ul li:last-child {
  margin-bottom: 25px;
}
.facHistory .section1 .facHistoryList li ul li span {
  font-weight: 700;
  padding-left: 23px;
  line-height: 1.35em;
  vertical-align: top;
}
.facHistory .section1 .facHistoryList li ul li p {
  max-width: 250px;
  padding-left: 9px;
  line-height: 1.35em;
  display: inline-block;
}
.facHistory .section1 .facHistoryList li ul li img {
  display: block;
  margin: 20px auto 17px;
}
.facHistory .section2 {
  font-family: "Nanum", sans-serif;
  margin-bottom: 20px;
}
.facHistory .section2 p {
  font-size: 16px;
  line-height: 1.55em;
  letter-spacing: -0.02em;
}
.facHistory .section2 img {
  width: 310px;
  height: 204px;
  margin: 38px auto 0;
  display: block;
}

@media (max-width: 380px) {
  .facHistory .section1 .facHistoryList li ul li span {
    padding-left: 13px;
  }
  .facHistory .section1 .facHistoryList li ul li p {
    max-width: 225px;
  }
}
#container.saleSpot .pageTitle {
  padding: 26px 40px 0;
}
#container.saleSpot .pageTitle .tit {
  font-size: 14px;
  color: #6B6B6B;
  font-weight: 300;
  letter-spacing: -0.05em;
}
#container.saleSpot .pageTitle .subTit {
  font-size: 24px;
  margin-top: 10px;
  letter-spacing: -0.005em;
}
#container.saleSpot .saleSpotArea {
  padding-top: 20px;
}
#container.saleSpot .saleSpotArea .depth1 li {
  width: calc(100% + 40px);
}
#container.saleSpot .saleSpotArea .depth1 li strong {
  font-size: 20px;
  font-weight: 700;
  padding: 22px 0;
  border-bottom: 2px solid #000;
  display: block;
  position: relative;
  transition: 0.2s;
  letter-spacing: -0.02em;
}
#container.saleSpot .saleSpotArea .depth1 li strong.on {
  color: #ED1C24;
  border-bottom: 2px solid #ED1C24;
  transition: 0.2s;
}
#container.saleSpot .saleSpotArea .depth1 li strong .ico.plus, #container.saleSpot .saleSpotArea .depth1 li strong .ico.minus {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.2s;
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 {
  padding-bottom: 41px;
  display: none;
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 li {
  padding: 23px 91px 19px 0;
  border-bottom: 1px solid #ddd;
  overflow: hidden;
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 li span {
  font-family: "Nanum", sans-serif;
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 li .spotTit {
  float: left;
  font-size: 16px;
  letter-spacing: -0.005em;
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 li .spotTel {
  float: right;
  font-size: 14px;
  position: relative;
  padding-left: 32px;
  letter-spacing: -0.02em;
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 li .spotTel:before {
  content: "";
  background: url("/m/static/images/common/ico_call.png") center no-repeat;
  position: absolute;
  background-size: 100%;
  width: 30px;
  height: 30px;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
#container.saleSpot .saleSpotArea .depth1 li .depth2 li:last-child {
  border-bottom: 0;
}
#container.saleSpot .saleSpotArea .depth1 li:last-child .depth2 {
  padding-bottom: 0;
}
#container.saleSpot .cokeTxtWrap {
  padding: 40px 0;
}
#container.saleSpot .cokeTxtWrap .cokeTxt {
  font-size: 16px;
  font-family: "Nanum", sans-serif;
  line-height: 26px;
  margin-bottom: 20px;
  letter-spacing: -0.015em;
}

#container.vision .headArea {
  margin-bottom: 22px;
}
#container.vision .headArea h2 {
  margin-bottom: 0;
}
#container.vision .topArea {
  overflow: hidden;
}
#container.vision .topArea .mainText {
  position: relative;
  font-size: 34px;
}
#container.vision .topArea .mainText:before {
  content: "";
  position: absolute;
  width: 47px;
  height: 38px;
  top: 41%;
  left: 33%;
  background: url("/m/static/images/icon/illust_bulb.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
#container.vision .topArea .mainText:after {
  content: "";
  position: absolute;
  width: 38px;
  height: 49px;
  top: 58%;
  left: 72%;
  background: url("/m/static/images/icon/illust_employeeid.png") no-repeat;
  background-size: 100%;
  background-position: center;
}
@media (max-width: 370px) {
  #container.vision .topArea .mainText:before {
    left: 35%;
  }
  #container.vision .topArea .mainText:after {
    left: 76%;
  }
}
#container.vision .topArea .subText {
  width: 250px;
}
#container.vision .visionArea .imgArea {
  width: 100vw;
  height: 299px;
  margin: 90px 0 42px;
  position: relative;
  left: -40px;
}
#container.vision .visionArea .imgArea:first-of-type {
  background-image: url("/m/static/images/company/vision1.jpg");
}
#container.vision .visionArea .imgArea:last-of-type {
  background-image: url("/m/static/images/company/vision2.jpg");
}
#container.vision .visionArea .imgArea h2 {
  font-size: 38px;
  font-weight: 400;
  position: absolute;
  left: 40px;
  top: -25px;
  line-height: 48px;
  white-space: nowrap;
}
#container.vision .visionArea .imgArea h2 span {
  color: #ED1C24;
  font-weight: 700;
}
#container.vision .visionArea ul li {
  padding: 28px 20px 21px 0;
  width: calc(100% + 40px);
  border-bottom: 1px solid #ddd;
}
#container.vision .visionArea ul li strong {
  font-size: 24px;
  letter-spacing: -0.015em;
  line-height: 32px;
}
#container.vision .visionArea ul li p {
  font-size: 16px;
  letter-spacing: -0.025em;
  margin-top: 14px;
  line-height: 26px;
  font-family: "Nanum", sans-serif;
}
#container.vision .visionArea ul li:first-child {
  padding-top: 0;
}
#container.vision .visionArea ul li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

/*# sourceMappingURL=content.css.map */