@charset "utf-8";

/*
 * custom_layout.css
 * 디자이너 커스텀요소
 *
 * custom selection
 * tab scroll mob
 * content tab
 * word
 * hide show - motion
 * 이미지 fixed
 * button motion
 * img 설정
 * content box
 * slide control
 * map box
 * gird	box
 * flex box
 * mob control - 모바일 안보이게 처리
 * data-form
 *
 */

:root {
  --page-pad: 80rem;
  --page-top: 80rem;

  /* height */
  --higMob100: calc(var(--vh, 1vh) * 100);
}
@media (max-width: 1500px) {
  :root {
    --page-pad: 40rem;
  }
}
@media (max-width: 1024px) {
  :root {
    --page-pad: 20rem;
  }
}
@media (max-width: 768px) {
  :root {
    --page-top: 60rem;
  }
}
@media (max-width: 480px) {
  :root {
    --page-top: 60rem;
  }
}

/* custom selection */
::selection {
  background: #9cbcec;
  color: #fff;
  text-shadow: none;
}
::-moz-selection {
  background: #9cbcec;
  color: #fff;
  text-shadow: none;
}
::-webkit-selection {
  background: #9cbcec;
  color: #fff;
  text-shadow: none;
}
@media (min-width: 1025px) {
  ::-webkit-scrollbar {
    width: 15rem;
  }
  ::-webkit-scrollbar-thumb {
    border: 4rem solid #f7f7f7;
    border-radius: 20rem;
    background: #c5c5c5;
  }
  ::-webkit-scrollbar-track {
    background: #f7f7f7;
  }
  /* transparent scroll */
  .overlay-scroll {
    overflow: overlay;
  }
  .overlay-scroll::-webkit-scrollbar {
    width: 8rem;
  }
  .overlay-scroll::-webkit-scrollbar-thumb {
    background-color: hsla(0, 0%, 42%, 0.3);
    border-width: 0rem;
  }
  .overlay-scroll::-webkit-scrollbar-track {
    background-color: transparent;
  }
  /* custom-scroll */
  .custom-scroll::-webkit-scrollbar {
    width: 6rem;
  }
  .custom-scroll::-webkit-scrollbar-thumb {
    border: 0;
    border-radius: 20rem;
    background: #c5c5c5;
  }
  .custom-scroll::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.7);
  }
}

/* tab scroll mob  */
.scroll_control .inner ul {
  display: flex;
}
.scroll_control .inner ul li {
  flex: none;
  white-space: nowrap;
}
.scroll_control .inner ul li:first-child {
  padding-left: 0 !important;
}
.scroll_control.full {
  --sizeBg: 30rem;
  position: relative;
}
.scroll_control.full .inner {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  width: 100%;
}
.scroll_control.full .inner > ul {
  flex-wrap: nowrap;
  justify-content: flex-start;
  margin: 0;
}
.scroll_control.full .inner > ul > li:last-child {
  padding-right: var(--sizeBg);
}
/* mask사용시 */
.scroll_control.full {
  mask: linear-gradient(
    90deg,
    rgba(0, 0, 0, 1) 20%,
    rgba(0, 0, 0, 1) 90%,
    rgba(0, 0, 0, 0) 100%
  );
}
/* bg사용시 */
/* .scroll_control.full:after{content:''; display:block; position:absolute; right:0; top:0; width:var(--sizeBg); height:100%; background-image:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.6) 20%, rgba(255,255,255,1) 80%);} */

/* content tab */
.tab-area {
  & {
    position: relative;
  }
  .tab {
    & {
      --sizeGap: 5rem;
      display: flex;
      justify-content: center;
      align-items: stretch;
      margin-bottom: 40rem;
    }
    li {
      display: flex;
      padding: 0 var(--sizeGap);
    }
    a {
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      min-width: 130rem;
      height: 40rem;
      background-color: #fff;
      border-radius: 5rem;
      font-size: var(--font16);
      color: #444;
      font-weight: 500;
      transition: color 0.3s;
    }
    .active a,
    a.on {
      background-color: var(--color-point);
      color: #fff;
      font-weight: 600;
      box-shadow: 0 10rem 20rem rgba(0, 0, 0, 0.15);
    }
  }
  .tab-box {
    & {
      opacity: 0;
      visibility: hidden;
      position: absolute;
      transition: 0.3s ease;
      transition-property: opacity, visibility;
    }
    &.active {
      opacity: 1;
      visibility: visible;
    }
  }
}

/* word */
.wordAni {
  opacity: 0;
}
.wordAni.active {
  opacity: 1;
}
.wordAni > span {
  display: inline-block;
}
.wordAni .word {
  display: inline-block;
}
/* motion rail */
[data-motion-rail] {
  position: absolute;
  left: 0;
  top: 0;
  text-transform: uppercase;
  font-size: 200rem;
  letter-spacing: 2rem;
  white-space: nowrap;
}
[data-motion-rail] .eocjs-newsticker-container {
  position: relative;
  width: 100%;
  padding-top: 30%;
}
[data-motion-rail].eocjs-newsticker .eocjs-newsticker-one,
[data-motion-rail].eocjs-newsticker .eocjs-newsticker-two {
  position: absolute;
  left: 0;
  top: 0;
  white-space: nowrap;
}

/* hide show - motion */
/*
	--aniEase:(transition-timing-function)
	--aniSize:(모션기초세팅사이즈)
	--aniDelay:(transition-delay)
	--aniTime:(transition-duration)
*/
[data-motion] img {
  width: 100%;
}
[data-motion="hide_show"] {
  opacity: 0;
  transition: opacity 0.7s var(--aniEase, ease) 0s;
}
[data-motion="hide_show"].motion__in {
  opacity: 1;
}
[data-motion="hide_showDown"] {
  opacity: 0;
  transform: translateY(var(--aniSize, -30rem));
  transition: var(--aniTime, 1s) var(--aniEase, ease) 0s;
  transition-property: opacity, transform;
}
[data-motion="hide_showDown"].motion__in {
  opacity: 1;
  transform: translateY(0);
  transition-delay: var(--aniDelay, 0s);
}
[data-motion="hide_showUp"] {
  opacity: 0;
  transform: translateY(var(--aniSize, 30rem));
  transition: var(--aniTime, 1s) var(--aniEase, ease) 0s;
  transition-property: opacity, transform;
}
[data-motion="hide_showUp"].motion__in {
  opacity: 1;
  transform: translateY(0rem);
  transition-delay: var(--aniDelay, 0s);
}
[data-motion="hide_showLeft"] {
  opacity: 0;
  transform: translateX(var(--aniSize, -30rem));
  transition: var(--aniTime, 0.9s) var(--aniEase, ease) 0s;
  transition-property: opacity, transform;
}
[data-motion="hide_showLeft"].motion__in {
  opacity: 1;
  transform: translateX(0rem);
  transition-delay: var(--aniDelay, 0s);
}
[data-motion="hide_showRight"] {
  opacity: 0;
  transform: translateX(var(--aniSize, 30rem));
  transition: var(--aniTime, 0.9s) var(--aniEase, ease) 0s;
  transition-property: opacity, transform;
}
[data-motion="hide_showRight"].motion__in {
  opacity: 1;
  transform: translateX(0);
  transition-delay: var(--aniDelay, 0s);
}
[data-motion="slide_showX"] {
  clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
  transition: clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;
}
[data-motion="slide_showX"].motion__in {
  clip-path: polygon(0% 0, 100% 0, 100% 100%, 0% 100%);
  transition-delay: var(--aniDelay, 0.2s);
}
[data-motion="slide_show_down"] {
  clip-path: polygon(100% 0, 100% 0, 0 0, 0 0);
  transition: clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;
}
[data-motion="slide_show_down"].motion__in {
  clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0);
  transition-delay: var(--aniDelay, 0.2s);
}
[data-motion="slide_show_up"] {
  clip-path: polygon(100% 100%, 100% 100%, 0 100%, 0 100%);
  transition: clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;
}
[data-motion="slide_show_up"].motion__in {
  clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0);
  transition-delay: var(--aniDelay, 0.2s);
}
[data-motion="slide_show_right"] {
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  transition: clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;
}
[data-motion="slide_show_right"].motion__in {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  transition-delay: var(--aniDelay, 0.2s);
}
[data-motion="slide_show_left"] {
  clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  transition: clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;
}
[data-motion="slide_show_left"].motion__in {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  transition-delay: var(--aniDelay, 0.2s);
}
[data-motion="mark"] mark {
  background: linear-gradient(
    90deg,
    var(--color-point, #333),
    var(--color-point, #333)
  );
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 100%;
  transition: var(--aniTime, 0.9s) var(--aniEase, ease) 0s;
}
[data-motion="mark"].motion__in mark {
  background-size: 100% 100%;
}
[data-motion="blur"] {
  filter: blur(var(--aniBlur, 10rem));
  transition: filter var(--aniTime, 1.5s) var(--aniEase, ease) 0s;
}
[data-motion="blur"].motion__in {
  filter: blur(0);
}
/* div[data-motion="hide_overUp"] span > i */
[data-motion="hide_overUp"] span {
  overflow: hidden;
  display: inline-block;
}
[data-motion="hide_overUp"] span i {
  display: inline-block;
  transform: translateY(100%);
  transition: transform var(--aniTime, 0.9s) var(--aniEase, ease) 0s;
}
[data-motion="hide_overUp"].motion__in span i {
  transform: translateY(0%);
  transition-delay: var(--aniDelay, 0s);
}
/* div[data-motion="hide_pectiveUp"] span or etc */
[data-motion="hide_pectiveUp"] {
  perspective: var(--aniPect, 1500rem);
}
[data-motion="hide_pectiveUp"] > * {
  opacity: 0;
  display: block;
  transform: translateY(var(--aniSize, 300rem)) rotateX(var(--aniDeg, 45deg));
  transition: 1s var(--aniEase, ease) 0s;
  transition-property: opacity, transform;
}
[data-motion="hide_pectiveUp"].motion__in > * {
  opacity: 1;
  transform: translateY(0) rotateX(0);
  transition-delay: var(--aniDelay, 0s);
  transition-duration: var(--aniTime, 0.7s);
}
/* flow text */
/*
	--aniTime:(animation-duration)	
*/
.flow-text {
  overflow: hidden;
  display: flex;
  white-space: nowrap;
  transition: 0.3s;
}
.flow-wrap {
  padding-right: 1.4881vw;
  line-height: 1.1cap;
  animation: textLoop var(--aniTime, 20s) linear infinite;
}
.flow-text.hover:hover .flow-wrap {
  animation-play-state: paused;
  cursor: pointer;
}
@keyframes textLoop {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-100%, 0, 0);
  }
}

/* 이미지 fixed */
.over-bg {
  position: relative;
  z-index: -1;
  height: var(--sizeHig, 600rem);
  box-sizing: border-box;
}
.over-bg .obj-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.over-bg .obj-bg i {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}
.over-bg .obj-bg i img {
  width: 100%;
}
.ie .over-bg .obj-bg {
  clip: rect(0, auto, auto, 0);
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .over-bg .obj-bg {
    -webkit-mask-image: -webkit-linear-gradient(top, #fff 0%, #fff 100%);
  }
}
@media (max-width: 1024px) {
  .over-bg .obj-bg i {
    height: var(--higMob100);
  }
}

/* button motion */
/* size별도선언할것 */
.primary-button {
  overflow: hidden;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.primary-button:hover,
.primary-button:hover span {
  color: #fff;
}
.primary-button .round {
  position: absolute;
  top: 5px;
  left: 10px;
  z-index: -1;
  background-color: #373737;
  border-radius: 50%;
  animation: scale-down 0.2s forwards;
}
.primary-button.animate .round {
  animation: scale-up 0.5s forwards;
}
@keyframes scale-up {
  to {
    transform: scale(600);
  }
}
@keyframes scale-down {
  from {
    transform: scale(600);
  }
  to {
    ransform: scale(0);
  }
}

/* img 설정 */
#content [data-main="service"] ul.list li a i img {
  /* width: 80%; */
  background-color: #f5f5f5;
  padding: 12px;
}

/* content box */
[class*="inr-1"] {
  padding: 0 var(--page-pad);
  margin: 0 auto;
  box-sizing: content-box;
}
.inr-1500 {
  max-width: 1500rem;
}
.inr-1400 {
  max-width: 1400rem;
}
.inr-1200 {
  max-width: 1200rem;
}
.inr-1000 {
  max-width: 1000rem;
}

/* slide control */
.swiper-page,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  width: auto;
}
.swiper-page {
  --swiper-theme-color: #beac9c /* 기본컬러 */;
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper-page .swiper-pagination-bullet {
  --swiper-pagination-bullet-size: 10rem /* 블릿사이즈 */;
  --swiper-pagination-bullet-horizontal-gap: 5rem /* 블릿여백 */;
  --swiper-pagination-bullet-inactive-color: #beac9c /* 기본색상 */;
  --swiper-pagination-bullet-inactive-opacity: 0.3 /* 블릿투명도 */;
}

/* map box */
.root_daum_roughmap {
  width: 100% !important;
  height: 100%;
}
.root_daum_roughmap .wrap_map {
  height: 100% !important;
}

/* gird box */
[data-grid] {
  display: grid;
}
[data-grid="2"] {
  grid-template-columns: repeat(2, 1fr);
}
[data-grid="3"] {
  grid-template-columns: repeat(3, 1fr);
}
[data-grid="4"] {
  grid-template-columns: repeat(4, 1fr);
}
[data-grid="5"] {
  grid-template-columns: repeat(5, 1fr);
}

/* flex box */
.flex-group {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.flex-group.left {
  justify-content: flex-start;
}

/* mob control */
@media (max-width: 1024px) {
  [data-mobNone="1024"] {
    display: none;
  }
}
@media (max-width: 768px) {
  [data-mobNone="768"] {
    display: none;
  }
}
@media (max-width: 480px) {
  [data-mobNone="480"] {
    display: none;
  }
}

/* data-form */
[data-form="write"] {
  --sizeHig: 60rem;
}
[data-form="write"] input:not([type="checkbox"]):not([type="radio"]),
[data-form="write"] select,
[data-form="write"] textarea {
  width: 100%;
  height: var(--sizeHig);
  box-sizing: border-box;
  padding: 0 30rem;
  background: transparent;
  border: 1rem solid #d9d9d9;
  border-radius: 0;
  vertical-align: middle;
  font-size: var(--font18);
  font-weight: 500;
  letter-spacing: -0.5rem;
  transition: border 0.3s ease 0s;
}
[data-form="write"] textarea {
  resize: none;
  height: 190rem;
  padding: 20rem 30rem;
}
[data-form="write"] select {
  padding-right: 30rem;
  background: var(--color-white, #fff) url(../images/board/select_arrow.svg)
    no-repeat calc(100% - 15rem) 50%;
  background-size: 7rem 7rem;
}
[data-form="write"] input:not([type="checkbox"]):not([type="radio"]):focus,
[data-form="write"] textarea:focus {
  outline: none;
}
[data-form="write"] :is(input[readonly], input[disabled]) {
  background-color: #f5f5f5 !important;
  color: #aaa !important;
}
[data-form="write"] {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60rem 50rem;
  padding-bottom: 90rem;
}
[data-form="write"] > li {
  display: flex;
  flex-direction: column;
  position: relative;
}
[data-form="write"] > li.full {
  grid-column: 1/3;
}
[data-form="write"] > li.full.textarea {
  margin-top: 30rem;
}
[data-form="write"] > li :is(> label, em) {
  opacity: 1;
  visibility: visible;
  display: inline-block;
  margin-bottom: 10rem;
  font-size: var(--font20);
  color: #000;
  font-weight: 600;
  transition: 0.3s ease 0s;
}
[data-form="write"] > li em {
  display: block;
}
[data-form="write"] .marking {
  margin-left: 10rem;
}
[data-form="write"] .in {
  z-index: 90;
}
[data-form="write"] .in :is(input, select, textarea, .designSelect .selectbox) {
  border-color: #222;
}
[data-form="write"] :is(.active, .in) > label,
[data-form="write"] :is(.active, .in) > em {
  color: var(--color-point);
}
[data-form="write"] .designRadio,
[data-form="write"] .designCheck {
  min-height: var(--sizeHig);
  box-sizing: border-box;
}
[data-form="write"] :is(.designRadio, .designCheck) label,
[data-form="write"] :is(.designRadio, .designCheck) em {
  color: inherit;
}
[data-form="write"] > li small {
  display: inline-block;
  margin-left: 10rem;
  font-size: var(--font16);
  color: #999;
}
[data-form="write"] input::placeholder {
  color: #999;
  font-size: var(--font16);
  font-weight: 400;
}
[data-form="write"] ::placeholder {
  opacity: 1;
  color: #999;
  font-size: var(--font16);
  font-weight: 400;
}
[data-form="write"] ::-ms-input-placeholder {
  color: #999;
  font-size: 16rem;
  font-weight: 400;
}
[data-form="write"] input[data-form-type="datepicker"] {
  padding-right: 40rem !important;
  text-align: left;
}
[data-form="write"] .ui-datepicker-trigger {
  position: absolute;
  right: 10rem;
  top: 50%;
  transform: translateY(-50%);
}
[data-form="select"] {
  z-index: 9;
}
[data-formwrite="mail"] > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10rem 30rem;
}
[data-formwrite="mail"] > div > div {
  display: flex;
  align-items: center;
  gap: 10rem;
  position: relative;
}
[data-formwrite="mail"] > div i {
  position: absolute;
  left: -23rem;
  top: 50%;
  z-index: 50;
  font-size: var(--font20);
  color: #999;
  font-weight: 500;
  transform: translateY(-50%);
}
[data-formWrite="case"] .designRadio input[type="radio"] + label {
  margin-right: 40rem;
  font-size: var(--font18);
}
[data-formWrite="case"] .designRadio input[type="radio"] + label:last-child {
  margin-right: 0;
}
[data-formWrite="case"] > div {
  margin-top: 10rem;
}
[data-formWrite="conts"] > div {
  margin-top: 20rem;
}
[data-form="write"] [data-formwrite="mail"] .select_input {
  opacity: 0;
  visibility: hidden;
  position: relative;
  z-index: 30;
  width: calc(100% - 55rem);
  padding-left: 45rem;
}
[data-form="write"] [data-formwrite="mail"] .select_input.active {
  opacity: 1;
  visibility: visible;
}
[data-form="write"]
  [data-formwrite="mail"]
  .select_input.active
  ~ .designSelect
  .selectbox {
  font-size: 0;
}
[data-formwrite="address"] .button {
  height: var(--sizeHig);
}
[data-formWrite="file"] .designFile {
  flex: none;
  width: 100%;
  box-sizing: border-box;
}
[data-formWrite="file"] .designFile.mob {
  line-height: 37rem;
}
[data-formWrite="file"] .designFile.mob input {
  height: auto;
  padding: 0 !important;
}
[data-formwrite="spam"] .inr {
  display: flex;
  align-items: stretch;
  gap: 10rem;
}
[data-formwrite="spam"] .spam {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 20rem;
  background-color: #222;
  font-weight: 700;
  color: #fff;
}
[data-formwrite="spam"] input {
  width: 100%;
  margin: 0;
}
.box_agree.designCheck {
  margin-top: 0;
}
.box_agree.designCheck input[type="checkbox"] + label {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3rem 5rem;
  margin-right: 10rem;
  vertical-align: middle;
  padding-left: 0;
  font-size: var(--font18);
  font-weight: 400;
}
.box_agree.designCheck input[type="checkbox"] + label:before {
  position: static;
  width: 22rem;
  height: 22rem;
}
.box_agree.designCheck input[type="checkbox"] + label i {
  line-height: 1.2;
  vertical-align: middle;
  font-size: var(--font15);
  color: #c31717;
}
.box_agree.designCheck a {
  display: inline-block;
  line-height: 1.2;
  font-size: var(--font16);
  color: #aaa;
  font-weight: 500;
  transition: 0.3s ease 0s;
}
.box_agree.designCheck a:after {
  content: "";
  display: block;
  width: 100%;
  height: 1rem;
  margin-top: -3rem;
  background: #aaa;
  transition: 0.3s ease 0s;
}
@media (hover: hover) {
  .box_agree.designCheck a:hover,
  .box_agree.designCheck a:focus {
    color: #666;
  }
  .box_agree.designCheck a:hover:after,
  .box_agree.designCheck a:focus:after {
    background: #666;
  }
}
@media screen and (max-width: 1024px) {
  /* data-form */
  [data-form="write"] {
    grid-template-columns: 1fr;
  }
  [data-form="write"] > li.full {
    grid-column: 1/2;
  }
  [data-form="write"] > li > div {
    margin-top: 0;
  }
  [data-form="write"] > li[data-formwrite="conts"] > div {
    margin-top: 20rem;
  }
  [data-form="write"] textarea {
    height: 130rem;
  }
  /* designFile */
  [data-form="write"] .designFile:not(.mob) label.button {
    min-width: inherit;
    width: 70rem;
  }
  [data-form="write"] .designFile:not(.mob) input[type="text"] {
    padding-right: 80rem;
  }
  [data-form="write"] [data-formWrite="file"] .designFile label.button {
    right: 0;
  }
  [data-formWrite="file"] .designFile {
    padding-right: 0;
  }
  [data-formWrite="file"] .file {
    width: 70%;
  }
  [data-formWrite="file"] .file > a {
    word-break: break-all;
  }
}

@media screen and (max-width: 768px) {
  /* data-form */
  [data-form="write"] {
    gap: 40rem;
  }
  [data-form="write"] .designRadio,
  [data-form="write"] .designCheck {
    min-height: inherit;
    padding-top: 0;
  }
  /* designFile */
  [data-formWrite="file"] .designFile,
  [data-formWrite="file"] .file {
    width: 100%;
    padding-right: 0;
  }
  [data-form="write"] [data-formWrite="file"] .designFile label.button {
    right: 0;
  }
}

@media screen and (max-width: 480px) {
  /* data-form */
  [data-form="write"] {
    --sizeHig: 50rem;
  }
  [data-form="write"] input:not([type="checkbox"]):not([type="radio"]),
  [data-form="write"] select {
    padding: 0 20rem;
  }
  [data-form="write"] select {
    padding-right: 35rem;
  }
  [data-form="write"] textarea {
    height: 100rem;
    padding: 20rem;
  }
  [data-formwrite="mail"] > div {
    grid-template-columns: 1fr;
  }
  [data-formwrite="mail"] > div > div {
    width: 100%;
    margin-right: 0;
  }
  [data-formwrite="mail"] > div > div:nth-of-type(2) {
    flex-wrap: wrap;
  }
  [data-formwrite="mail"] > div i {
    position: static;
    transform: translateY(0);
  }
  [data-formwrite="mail"] > div select {
    width: calc(100% - 30rem);
    margin-left: auto;
  }
  [data-formwrite="mail"] .designSelect {
    width: calc(100% - 35rem);
  }
  [data-form="write"] [data-formwrite="mail"] .select_input {
    width: calc(100% - 45rem);
    padding-left: 0;
  }
  [data-formWrite="case"] .designRadio input[type="radio"] + label {
    margin-right: 20rem;
  }
  .box_agree.designCheck input[type="checkbox"] + label {
    margin-right: 10rem;
    line-height: 1.3;
  }
}