@import "shortLayout.css";
div {
  box-sizing: border-box;
}

@font-face {
  src: url("fonts/icons.woff") format("woff");
  font-family: "Icons";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-decoration: inherit;
  text-transform: none;
}
.wrap {
  margin-bottom: 10vw;
}

.visual {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 10vw;
  border-bottom: 1px solid #e0e0e0;
}
.visual .inner .header {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  row-gap: 1.8vw;
}
.visual .inner .header h3 {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 3vw;
  width: -moz-fit-content;
  width: fit-content;
  font-family: "KTB";
  font-weight: 700;
  font-size: 6vw;
  color: #000;
}
.visual .inner .header h3 span {
  position: absolute;
  top: 0;
  right: -8vw;
  width: 6.5vw;
  height: 6.5vw;
  background-image: url("/static/images/mobile/btn_share.jpg");
  background-repeat: no-repeat;
  background-size: contain;
}
.visual .inner .header p {
  font-size: 3.45vw;
  color: #222;
}

.tabCont {
  display: flex;
  align-items: center;
  -moz-column-gap: 4vw;
       column-gap: 4vw;
  padding: 0 4.0625vw;
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}
.tabCont li {
  flex-grow: 1;
  display: flex;
  align-items: center;
  width: 100%;
  height: 12vw;
}
.tabCont li button {
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 3.67vw;
  color: #666;
  line-height: 1.2;
  word-break: keep-all;
}
.tabCont li button.current {
  font-weight: 500;
  font-size: 3.67vw;
  color: #d71826;
}
.tabCont li button.current:after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 2.5px;
  background-color: #d71826;
}
.tabCont.info button.current {
  color: #00a69e;
}
.tabCont.info button.current:after {
  background-color: #00a69e;
}

.tabChild {
  display: none;
}
.tabChild.current {
  display: block;
}

.invisible {
  position: absolute;
  left: -1000%;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

ul.sns {
  position: absolute;
  top: 10vw;
  left: -50%;
  z-index: 5;
  display: none;
  padding: 3vw 2vw;
  border: 1px solid #bfbfbf;
  background-color: #fff;
}
ul.sns:before {
  position: absolute;
  top: -9px;
  left: calc(50% - 6px);
  z-index: 5;
  content: "";
  display: block;
  width: 12px;
  height: 9px;
  background-image: url("/static/images/mobile/arrow-sns.jpg");
  background-repeat: no-repeat;
  background-size: contain;
}
ul.sns li + li {
  margin-top: 2.3vw;
}
ul.sns li button {
  display: flex;
  align-items: center;
  flex-direction: column;
  row-gap: 0.5vw;
  font-weight: 700;
  font-size: 2.8vw;
  color: #666;
  text-align: center;
  letter-spacing: -0.15vw;
}
ul.sns li button:before {
  content: "";
  display: block;
  width: 10vw;
  height: 10vw;
  background-repeat: no-repeat;
  background-size: contain;
}
ul.sns li.kakao button:before {
  background-image: url("/static/images/mobile/btn_kakao.jpg");
}
ul.sns li.facebook button:before {
  background-image: url("/static/images/mobile/btn_fb.jpg");
}
ul.sns li.x button:before {
  background-image: url("/static/images/mobile/btn_twitter.jpg");
}
ul.sns li.line button:before {
  background-image: url("/static/images/mobile/btn_line.jpg");
}

@media screen and (min-width: 516px) and (max-width: 1023px) {
  .visual {
    padding: 5vw;
  }
  .visual .inner .header h3 {
    gap: 0 1.5vw;
    font-size: 3.4vw;
  }
  .visual .inner .header h3 span {
    right: -4.5vw;
    width: 3.6vw;
    height: 3.6vw;
  }
  .visual .inner .header p {
    font-size: 2.2vw;
  }
  ul.sns {
    position: absolute;
    top: 5.3vw;
    left: -50%;
    z-index: 5;
    display: none;
    padding: 1.5vw 1.2vw;
  }
  ul.sns li + li {
    margin-top: 1.3vw;
  }
  ul.sns li button {
    font-size: 1.3vw;
  }
  ul.sns li button:before {
    content: "";
    width: 4.5vw;
    height: 4.5vw;
  }
  .tabCont {
    -moz-column-gap: 2vw;
         column-gap: 2vw;
    padding: 0 3.05vw;
  }
  .tabCont li {
    height: 6.5vw;
  }
  .tabCont li button {
    font-size: 2.1vw;
  }
  .tabCont li button.current {
    font-size: 2.35vw;
  }
}
h1 {
  position: relative;
}
h1.tit {
  padding: 3vw 0;
  font-weight: 700;
  font-size: 6vw;
  color: #fff;
  text-align: center;
  background-color: #2aabc0;
}
h1.tit.sub {
  font-size: 4vw;
}
h1 a {
  position: absolute;
  bottom: 10vw;
  left: 50%;
  width: 80vw;
  transform: translateX(-50%);
}

.contWrap .topDec {
  margin-bottom: 3vw;
  font-size: 3.8vw;
  text-align: center;
}
.contWrap .topDec strong {
  color: #10a09a;
}
.contWrap table {
  width: 100%;
  border-collapse: collapse;
  border-top: 2px solid #777;
  border-bottom: 2px solid #e0e1e3;
}
.contWrap table thead th {
  padding: 2vw 0;
  font-size: 3.25vw;
  color: #3d3d3d;
  border-bottom: 1px solid #e0e0e0;
  background-color: #f6f6f6;
}
.contWrap table thead th + th {
  border-left: 1px solid #e0e0e0;
}
.contWrap table tbody th {
  padding: 2vw 1.5vw;
  font-weight: 500;
  font-size: 3.2vw;
  color: #666;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  background-color: #c1ebe6;
}
.contWrap table tbody td {
  padding: 2vw;
  font-size: 3.2vw;
  color: #666;
  text-align: center;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}
.contWrap table tbody td:last-child {
  border-right: 0;
}
.contWrap table tbody td:only-child {
  border-right: 1px solid #e0e0e0;
}
.contWrap table + p {
  margin-top: 2vw;
  font-size: 3.4vw;
  color: #222;
}
.contWrap table.rate {
  margin-bottom: 5vw;
  border-top: 0;
  border-bottom: 1px solid #dcdcdc;
}
.contWrap table.rate tbody td {
  padding: 2vw 0;
  font-size: 3.2vw;
  color: #666;
  border-right: 0;
  border-bottom: 1px solid #dcdcdc;
}
.contWrap table.rate tbody td:first-child {
  text-align: left;
}
.contWrap table.rate tbody td span.prodName {
  font-weight: 700;
  font-size: 3.45vw;
  color: #222;
}
.contWrap table.rate tbody td span.prodName strong {
  color: #05a4bc;
}
.contWrap table.rate tbody td span.amount {
  font-weight: 700;
  font-size: 3.25vw;
  color: #222;
}
.contWrap table.rate tbody td span.amount strong {
  color: #05a4bc;
}
.contWrap table.rate tbody td span.bracket {
  display: block;
  font-weight: 300;
  font-size: 3vw;
  color: #767676;
  line-height: 1.2;
}
.contWrap table.rate tbody td span.fee {
  font-weight: 700;
  font-size: 3.25vw;
  color: #05a4bc;
}
.contWrap table.rate tbody td span.fee em {
  font-weight: 400;
  color: #333;
}
.contWrap table.rate tbody td a {
  text-decoration: none;
}
.contWrap table.coverage tbody th {
  background-color: #fff;
}
.contWrap table.coverage tbody th + td {
  background-color: #c1ebe6;
}
.contWrap table.coverage tbody td.unavailable {
  background-color: #f6cdc4;
}
.contWrap table.data {
  margin-top: 3vw;
  border-top: 2px solid #e0e1e3;
}
.contWrap table.data thead th {
  padding: 1vw 0;
  font-weight: 400;
  font-size: 3vw;
  border-left: 0;
  border-right: 1px solid #e0e0e0;
}
.contWrap table.data thead th.after {
  font-weight: 700;
  background-color: #ffd5d7;
}
.contWrap table.data tbody th {
  font-size: 3vw;
  background-color: #f6f6f6;
}
.contWrap table.data tbody td {
  font-size: 3vw;
}
.contWrap table.data tbody td strong {
  color: #fe2e36;
}
.contWrap .footDesc {
  margin: 3vw 0 0 4.2vw;
  font-size: 3.35vw;
  color: #6d6d6d;
  line-height: 1.3;
  text-align: justify;
  text-indent: -4.2vw;
}
.contWrap .footDesc.red {
  color: #d71826;
}
.contWrap a.link {
  margin: 5vw auto;
  padding: 3vw 0;
  width: 80vw;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  font-size: 5vw;
  color: #10a09a;
  line-height: 1;
  border: 2px solid #10a09a;
  border-radius: 3vw;
  text-decoration: none;
}
.contWrap .infoTit {
  padding: 3vw 4.5vw;
  font-weight: 700;
  font-size: 3.8vw;
  color: #fff;
  background-color: #05a4bc;
}
.contWrap .infoTit strong {
  display: inline-block;
  margin: 0.8vw 0;
  padding: 0.8vw 3vw;
  color: #05a4bc;
  border-radius: 4vw;
  background-color: #fff;
}
.contWrap .infoTit span {
  color: #ffe3a7;
}
.contWrap h4 {
  display: flex;
  align-items: center;
  -moz-column-gap: 2vw;
       column-gap: 2vw;
  margin-bottom: 5vw;
  padding-bottom: 3vw;
  font-weight: 700;
  font-size: 5.6vw;
  color: #222;
  border-bottom: 1px solid #afafaf;
}
.contWrap h4:before {
  content: "";
  display: block;
  width: 8vw;
  height: 8vw;
  background-size: cover;
}
.contWrap h4.with:before {
  background-image: url("/static/images/short/icon_25ton.png");
  background-repeat: no-repeat;
  background-position: 0 0;
}
.contWrap h4.allDay:before {
  background-image: url("/static/images/short/icon_25ton.png");
  background-repeat: no-repeat;
  background-position: 100% 0;
}
.contWrap .withText {
  margin-bottom: 1.2vw;
  font-weight: 700;
  font-size: 3.8vw;
  color: #000;
  line-height: 1.3;
  text-align: center;
}
.contWrap .infoBox {
  padding: 2vw 0;
  font-weight: 700;
  font-size: 5vw;
  color: #fff;
  line-height: 1;
  text-align: center;
  background-color: #fe2e36;
}
.contWrap .viewBtn {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 5vw 1vw;
  margin: 5vw 0 8vw;
}
.contWrap .viewBtn p {
  width: 100%;
  font-weight: 700;
  font-size: 4vw;
  color: #222;
  text-align: center;
}
.contWrap .viewBtn a {
  padding: 2vw 3vw;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 700;
  font-size: 3.5vw;
  line-height: 1;
  border: 0.46875vw solid #000;
  border-radius: 5vw;
  text-decoration: none;
}
.contWrap .viewBtn a:nth-child(2) {
  width: 23vw;
  color: #fe2e36;
  border-color: #fe2e36;
}
.contWrap .viewBtn a:nth-child(3) {
  width: 23vw;
  color: #213043;
  border-color: #213043;
}
.contWrap .viewBtn a:nth-child(4) {
  width: 23vw;
  color: #d72e35;
  border-color: #d72e35;
}
.contWrap .viewBtn a:only-child {
  color: #d72e35;
  border-color: #d72e35;
}

.conts nav {
  display: flex;
  align-items: stretch;
  border-top: 2px solid #9d9d9d;
  border-bottom: 2px solid #9d9d9d;
}
.conts nav a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 2vw 0;
  width: 100%;
  font-weight: 500;
  font-size: 4.5vw;
  color: #666;
  line-height: 1.05;
  text-align: center;
  background-color: #eaeaea;
  text-decoration: none;
}
.conts nav a + a {
  border-left: 1px solid #bcbcbc;
}
.conts nav a.on {
  color: #fff;
  background-image: url("/static/images/short/bg_tabmenu.png");
  background-repeat: repeat-x;
  background-position: 0 0;
  background-size: contain;
}
.conts nav + h6 {
  margin-top: 5vw;
}
.conts .tabBtnWrap {
  margin-top: 5vw;
}
.conts .topDesc {
  padding: 3vw;
  font-size: 3.4vw;
  color: #666;
}
.conts h6 {
  margin: 0 0 2vw 3vw;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  -moz-column-gap: 1vw;
       column-gap: 1vw;
  font-weight: 700;
  font-size: 4vw;
  color: #222;
}
.conts h6:before {
  content: "";
  display: block;
  width: 4vw;
  height: 4vw;
  background-image: url("/static/images/short/icon_tit.png");
  background-size: contain;
}
.conts h6 span {
  padding-left: 5vw;
  width: 100%;
  color: #d71826;
}
.conts .freeCont {
  margin: 0 4vw 8vw;
}
.conts .freeCont p {
  font-size: 3.5vw;
  color: #444;
  line-height: 1.2;
}
.conts .freeCont img.box {
  margin-top: 3vw;
}
.conts .freeCont dl {
  margin-top: 3vw;
}
.conts .freeCont dl dt {
  font-weight: 700;
  font-size: 4vw;
  color: #222;
}
.conts .freeCont dl dd {
  margin: 2vw 0 0 5vw;
  font-weight: 700;
  font-size: 3.8vw;
  color: #d71826;
  text-indent: -2vw;
}
.conts table {
  width: 100%;
  border-collapse: collapse;
  border-top: 2px solid #777;
  border-bottom: 2px solid #e0e1e3;
}
.conts table tbody th {
  padding: 2vw 1.5vw;
  font-weight: 500;
  font-size: 3.2vw;
  color: #666;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  background-color: #f9f9f9;
}
.conts table tbody td {
  padding: 2vw;
  font-size: 3.2vw;
  color: #666;
  text-align: center;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}
.conts table tbody td:last-child {
  border-right: 0;
}
.conts table tbody td:only-child {
  border-right: 1px solid #e0e0e0;
}
.conts table tbody td.left {
  text-align: left;
}
.conts table tbody td .red {
  font-weight: 400;
  color: #d71826;
}
.conts table + h6 {
  margin-top: 5vw;
}
.conts .boxRed {
  margin: 0 5vw;
  padding: 4vw;
  border: 6px solid #de1a22;
}
.conts .boxRed p {
  font-size: 5.5vw;
  color: #333;
  line-height: 1.4;
  text-align: center;
}
.conts .boxRed p b {
  color: #d71826;
}
.conts .boxRed strong {
  display: block;
  margin-top: 2vw;
  font-size: 8vw;
  color: #d71826;
  line-height: 1.4;
  text-align: center;
}
.conts .boxRed + a.link2 {
  margin-top: 10vw;
}
.conts > dl {
  margin: 5vw 5vw 0;
}
.conts > dl dt {
  font-weight: 700;
  font-size: 4vw;
  color: #222;
}
.conts > dl dd {
  margin: 2vw 0 0 5vw;
  font-weight: 400;
  font-size: 3.8vw;
  color: #333;
  text-indent: -2vw;
}
.conts > dl .red {
  color: #d71826;
}
.conts p.info {
  margin: 3vw 5vw;
  padding-left: 5vw;
  font-weight: 400;
  font-size: 3.8vw;
  color: #333;
  text-indent: -5vw;
}
.conts p.desc {
  margin: 8vw 5vw 3vw;
  font-weight: 400;
  font-size: 3.8vw;
  color: #333;
  text-align: center;
}
.conts p.desc .red {
  color: #d71826;
}
.conts a.link2 {
  margin: 0 5vw;
  padding: 3vw 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-size: 5vw;
  color: #d71826;
  line-height: 1;
  border: 2px solid #d71826;
  border-radius: 3vw;
  text-decoration: none;
}
.conts a.link3 {
  margin: 0 5vw;
  padding: 3vw 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-size: 5vw;
  color: #333;
  line-height: 1;
  border: 2px solid #636363;
  border-radius: 3vw;
  text-decoration: none;
}
.conts hr {
  margin: 8vw 5vw 0;
  border: 2px solid #d1d1d1;
}
.conts .guide {
  position: relative;
}
.conts .guide .btn {
  display: flex;
  flex-direction: column;
  row-gap: 3vw;
  position: absolute;
  bottom: 20vw;
  left: 50%;
  width: 70vw;
  transform: translateX(-50%);
}
.conts .guide .head {
  position: relative;
  font-weight: 700;
  font-size: 5vw;
  color: #222;
  line-height: 3;
  text-align: center;
}
.conts .guide .head button {
  font-size: 1px;
  width: 12px;
  height: 12px;
  border-top: 3px solid #333333;
  border-left: 3px solid #333333;
  transform: rotate(-45deg);
  position: absolute;
  left: 18px;
  top: calc(50% - 8px);
  z-index: 10;
}
.conts .guide ul {
  display: flex;
  border-top: 1px solid #e4e4e4;
  border-bottom: 1px solid #e4e4e4;
}
.conts .guide ul li {
  width: 100%;
}
.conts .guide ul li button {
  position: relative;
  padding: 2.5vw 0;
  width: 100%;
  font-size: 4vw;
  color: #333;
}
.conts .guide ul li button.on {
  font-weight: 700;
  color: #2bb7b3;
}
.conts .guide ul li button.on:after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 3px;
  background-color: #2bb7b3;
}
.conts .guide ul li + li {
  border-left: 1px solid #e4e4e4;
}
.conts .guide .cont-wrap {
  padding: 5vw;
}/*# sourceMappingURL=dfree.css.map */